使用jquery更改DIV順序

Question

我正在使用客戶端基於HTML的網站，需要在刷新頁面時隨機訂購一組Div。 我通常會通過PHP和數據庫調用來處理這個問題，但它是一個靜態站點。

所以，我想知道是否有人知道如何使用jquery隨機顯示一組div？

這是一個例子：

<div class="myItems">
     <div class="item">1</div>
     <div class="item">2</div>
     <div class="item">3</div>
</div>

並且在刷新時，它可能會更改為：

<div class="myItems">
     <div class="item">2</div>
     <div class="item">3</div>
     <div class="item">1</div>
</div>

誰知道怎么做？

Answer 1

這將做到這一點

 function reorder() {
           var grp = $(".myItems").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();
         $(".myItems").append($(grp));
       }

Answer 2

實際上它非常簡單：

$(".myItems").html($(".myItems .item").sort(function(){
    return Math.random()-0.5;
}));

而已！ 請享用。

Answer 3

另一種簡單的方法是...... 1.創建一個數組2.生成一個隨機數並檢查它是奇數還是偶數3.如果是奇數，將你的div添加到頂部（shift方法）。 如果是偶數，請將div添加到底部（推送方法）。 所以這樣你就可以在數組中隨機排列你的div。 5.現在簡單地加入數組並將其附加到您的頁面。

var divArray = [];

for(var i=0; i<divs.length; i++){
  //generate random number
  if(rand_num == odd)
     divArray.push( div[i] );
  else
     divArray.shift( div[i] );
}

$(myElem).html( divArray.join("") );