Estoy usando el siguiente código para asignar una clase al azar (de cinco) para cada imagen individual en mi página.

$(this).addClass('color-' + (Math.floor(Math.random() * 5) + 1));

Es un gran trabajo pero quiero hacerlo de modo que nunca hay dos de la misma clase en una fila.

Sería aún mejor si nunca hubo dos de la misma en una fila, y también no hizo uso de cualquier clase más de una vez hasta que todos los 5 había sido utilizado… Como quitar cada clase a partir de la matriz hasta que todos ellos han sido utilizados, a continuación, empezar de nuevo, no permitiendo la última de las anteriores 5 y el primero de los próximos 5 a ser del mismo color.

Espero que tenga sentido, y gracias de antemano por cualquier ayuda.

Crear una gama de 1 a 5 y barajar la matriz.

OriginalEl autor user2860129 | 2013-10-14

4 Comentarios

  1. 19

    Usted necesita para crear una matriz de los valores posibles y cada vez que recuperar un índice aleatorio de la matriz a utilizar uno de los valores, que se quite de la matriz.

    He aquí el propósito general de la función random, que no voy a repetir hasta que todos los valores han sido utilizados. Usted puede llamar a esto y, a continuación, sólo tiene que añadir el índice al final de tu nombre de la clase.

    var uniqueRandoms = [];
    var numRandoms = 5;
    function makeUniqueRandom() {
        //refill the array if needed
        if (!uniqueRandoms.length) {
            for (var i = 0; i < numRandoms; i++) {
                uniqueRandoms.push(i);
            }
        }
        var index = Math.floor(Math.random() * uniqueRandoms.length);
        var val = uniqueRandoms[index];
    
        //now remove that value from the array
        uniqueRandoms.splice(index, 1);
    
        return val;
    
    }

    Demo: http://jsfiddle.net/jfriend00/H9bLH/


    Así, el código sería este:

    $(this).addClass('color-' + (makeUniqueRandom() + 1));

    Aquí es orientado a objetos de formulario que permitirá que más de uno de estos para ser usados en diferentes lugares en su aplicación:

    //if only one argument is passed, it will assume that is the high
    //limit and the low limit will be set to zero
    //so you can use either r = new randomeGenerator(9);
    //or r = new randomGenerator(0, 9);
    function randomGenerator(low, high) {
        if (arguments.length < 2) {
            high = low;
            low = 0;
        }
        this.low = low;
        this.high = high;
        this.reset();
    }
    
    randomGenerator.prototype = {
        reset: function() {
            this.remaining = [];
            for (var i = this.low; i <= this.high; i++) {
                this.remaining.push(i);
            }
        },
        get: function() {
            if (!this.remaining.length) {
                this.reset();
            }
            var index = Math.floor(Math.random() * this.remaining.length);
            var val = this.remaining[index];
            this.remaining.splice(index, 1);
            return val;        
        }
    }

    El Ejemplo De Uso:

    var r = new randomGenerator(1, 9);
    var rand1 = r.get();
    var rand2 = r.get();

    Demo: http://jsfiddle.net/jfriend00/q36Lk4hk/

    Si pudieras mostrarme exactamente cómo «llamar a esto» y «agregar el índice» para el nombre de la clase estaría eternamente agradecido. Yo no tengo experiencia con javascript, pero compré un libro de esta semana y acabo de comenzar hoy, así que estoy tratando de arreglar eso. Gracias de nuevo, lo que has publicado ya es realmente útil.
    He añadido al final.
    Una de estas mejoras es mantener la matriz original y hacer una copia para el empalme. Cuando todos los miembros han sido empalmados, hacer otra copia (si es necesario).
    ¿por qué es más fácil copiar que crear uno nuevo cuando sea necesario?
    Porque el original no sólo puede ser una secuencia de dígitos, o tener un poco de orden como ‘colour1’, ‘colour2’, etc.

    OriginalEl autor jfriend00

  2. 2

    Puede hacer algo como esto utilizando una matriz y el empalme método:

    var classes = ["color-1", "color-2", "color-3", "color-4", "color-5"];
    for(i = 0;i < 5; i++){
      var randomPosition = Math.floor(Math.random() * classes.length);
      var selected = classes.splice(randomPosition,1);
      console.log(selected);
      alert(selected);
    }

    OriginalEl autor Johann Echavarria

  3. 1
    var used = [];
    var range = [0, 5];
    
    var generateColors = (function() {
        var current;
        for ( var i = range[0]; i < range[5]; i++ ) {
    
            while ( used.indexOf(current = (Math.floor(Math.random() * 5) + 1)) != -1 ) ;
            used.push(current);
            $("   SELECTOR     ").addClass('color-' + current);
        }
    });

    OriginalEl autor Deepsy

  4. 1

    Sólo para explicar mi comentario para jfriend00 excelente respuesta, usted puede tener una función que devuelve los miembros de un conjunto en orden aleatorio hasta que todos hayan sido devueltos, luego comienza de nuevo, por ejemplo:

    function RandomList(list) {
      var original = list;
      this.getOriginal = function() {
        return original;
      }
    }
    
    RandomList.prototype.getRandom = function() {
      if (!(this.remainder && this.remainder.length)) {
        this.remainder = this.getOriginal().slice();
      }
      return this.remainder.splice(Math.random() * this.remainder.length | 0,1);
    }
    
    var list = new RandomList([1,2,3]);
    
    list.getRandom(); //returns a random member of list without repeating until all
                      //members have been returned.

    Si la lista puede ser codificado, usted puede mantener el original en un cierre, por ejemplo,

    var randomItem = (function() {
      var original = [1,2,3];
      var remainder;
      return function() {
        if (!(remainder && remainder.length)) {
          remainder = original.slice();
        }
        return remainder.splice(Math.random() * remainder.length | 0, 1);
      };
    }());

    OriginalEl autor RobG

Dejar respuesta

Please enter your comment!
Please enter your name here