¿Cómo ordenar un orden div aleatorio en jQuery?

En la carga de la página, estoy aleatorizando el orden de los divs secundarios con este Código:

function reorder() {
   var grp = $("#team-posts").children();
   var cnt = grp.length;

   var temp, x;
   for (var i = 0; i < cnt; i++) {
       temp = grp[i];
       x = Math.floor(Math.random() * cnt);
       grp[i] = grp[x];
       grp[x] = temp;
   }
   $(grp).remove();
   $("#team-posts").append($(grp));
}

Parece que no puedo averiguar cómo recuperar las publicaciones en el orden original. Aquí está la demostración de mi código actual http://jsfiddle.net/JsJs2/

preguntado el 02 de julio de 12 a las 16:07

Podría clonar el grupo original para su función y mover los originales a un elemento oculto. -

4 Respuestas

Guarde la copia original como sigue antes de llamar reorder() y utilícelo para reordenarlo más tarde.

var orig = $("#team-posts").children();

$("#undo").click(function() {
    orderPosts();
});

function orderPosts() {
   $("#team-posts").html( orig )  ;
}

Demostración de trabajo

Código Completo

var orig = $("#team-posts").children(); ///caching original

reorder();

$("#undo").click(function(e) {
    e.preventDefault();
    orderPosts();
});

function reorder() {
    var grp = $("#team-posts").children();
    var cnt = grp.length;

    var temp, x;
    for (var i = 0; i < cnt; i++) {
        temp = grp[i];
        x = Math.floor(Math.random() * cnt);
        grp[i] = grp[x];
        grp[x] = temp;
    }
    $(grp).remove();
    $("#team-posts").append($(grp));
}

function orderPosts() {
    // set original order
    $("#team-posts").html(orig);
}

Respondido el 20 de junio de 20 a las 10:06

¿Qué tal un Complemento "deshacer", suponiendo que se aplica?

Respondido 02 Jul 12, 16:07

Solo asigne a cada elemento una clase con el orden correspondiente y luego obtenga el nombre de clase de cada div y guárdelo en una variable

$("#team-posts div").each(function() {
    var parseIntedClassname = parseInt($(this).attr("class");
    arrayName[parseIntedClassname] = $("#team-posts div." + parseIntedClassname).html()
});

Puede reordenarlos desde allí guardando su html en una matriz en orden

$("#team-posts").html();
for(var i=0;i<arrayName.length;i++){
    $("#team-posts").append('<div class="'+i+'">'+arrayName[i]+'</div>');
}

Respondido 02 Jul 12, 16:07

La solución de guardar el pedido original es probablemente la mejor, pero si tiene que ordenarlo dinámicamente, puede usar esto:

http://www.w3schools.com/jsref/jsref_sort.asp

function orderPosts() {
    var $grp = $("#team-posts"),
        ordered = $grp.children().toArray().sort(function(a, b) {
            return parseInt($(a).text()) > parseInt($(b).text());
        });
    $grp.empty().append(ordered);
}

Respondido 02 Jul 12, 16:07

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.