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

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

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();

使用jQuery以随机顺序显示具有不同图像的相同类

2 个答案: