javascript - 使用 jquery 随机播放一些 div

Question

我想打乱我div桌子上的单元格。我尝试使用该.shuffle()插件，但无法使其工作。这是我的代码：

<div class="sprites">
    <div class="row">
        <span id="draggable0" class="draggable"></span> 
        <span id="draggable1" class="draggable"></span> 
        <span id="draggable2" class="draggable"></span>
    </div>
    <div class="row">
        <span id="draggable3" class="draggable"></span> 
        <span id="draggable4" class="draggable"></span> 
        <span id="draggable5" class="draggable"></span>
    </div>
    <div class="row">
        <span id="draggable6" class="draggable"></span> 
        <span id="draggable7" class="draggable"></span> 
        <span id="draggable8" class="draggable"></span>
    </div>
</div>

这就是我尝试洗牌的方式：

$(document).ready(function () {
    $('.sprites').shuffle();
});   

你知道我怎么能洗牌所有这些东西吗？

Answer 1

小提琴

这只会打乱 class 的元素sprites。你想洗牌div里面的 s .sprites，对吧？

$('.sprites div').shuffle();

编辑：正确的语法实际上可能是：

$.shuffle('.sprites div');

Answer 2

shuffle()将传递给它的元素打乱...您需要将盒子内的项目传递给它...

只需使用这个：现场演示

$('.draggable').shuffle();

或者

$('.row').shuffle();

更新

使用它重新启用拖动。

$(document).ready(function() {
       $('.draggable').draggable(); 
});

function shuffle () {
    $('.draggable').draggable("destroy");
    $('.draggable').shuffle();
    $('.draggable').draggable();
}

洗牌代码

(function(d){
    d.fn.shuffle=function(c){
        c=[];
        return this.each(function()
            {
                c.push(d(this).clone(true))
            }).each(function(a,b)
            {
                d(b).replaceWith(c[a=Math.floor(Math.random()*c.length)]);
                c.splice(a,1)
            })
    };
    d.shuffle=function(a){
        return d(a).shuffle()
    }
})(jQuery);