jquery - 使用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？谢谢

Answer 1

创建随机数字段并将它们像 ID 一样添加到 div，然后将图像添加到 div

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

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

Answer 2

你可以使用这个简单的插件：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();