顯示相同的類與diffrerent圖像使用jQuery

Question

隨機順序這是我的HTML

<div id="abc"> 
    <div class="asd">image1</div> 
    <div class="asd">image2</div> 
    <div class="asd">image3</div> 
    <div class="asd">image4</div> 
    <div class="asd">image5</div> 
</div> 

我想在每次刷新隨機顯示圖像。這怎麼可能使用Jquery？ Thankz

Answer 1

你可以使用這個簡單的插件：http://css-tricks.com/snippets/jquery/shuffle-dom-elements/

(function($){ 

    $.fn.shuffle = function() { 

     var allElems = this.get(), 
      getRandom = function(max) { 
       return Math.floor(Math.random() * max); 
      }, 
      shuffled = $.map(allElems, function(){ 
       var random = getRandom(allElems.length), 
        randEl = $(allElems[random]).clone(true)[0]; 
       allElems.splice(random, 1); 
       return randEl; 
      }); 

     this.each(function(i){ 
      $(this).replaceWith($(shuffled[i])); 
     }); 

     return $(shuffled); 

    }; 

})(jQuery); 

你的情況，你可以使用它是這樣的：

$('#abc > div').shuffle(); 

Answer 2

創建隨機數的字段並添加他們像ID來的div然後將圖像添加到資料覈實

var NumbOfDivs = x 
var number = Math.floor(Math.random() * NumbOfDivs); 
var fieldID = []; 

if(fieldID.contains(number)){ 
} 
else{fieldID.push(number)}