我需要做的是: 原始状态:
<div class="shuffledv">
<div id="1"></div>
<div id="2"></div>
<div id="3"></div>
</div>
<div class="shuffledv">
<div id="4"></div>
<div id="5"></div>
<div id="6"></div>
</div>
洗牌后:
<div class="shuffledv">
<div id="2"></div>
<div id="3"></div>
<div id="1"></div>
</div>
<div class="shuffledv">
<div id="5"></div>
<div id="4"></div>
<div id="6"></div>
</div>
第一个 div 中的 Divs 留在那里但会被打乱,同样的情况也会发生在具有相同类的第二个 div 中。 要在特定的 div 中随机播放 div,我使用如下方法:
function shuffle(e) { // pass divs inside #parent to the function
var replace = $('<div>');
var size = e.size();
while (size >= 1) {
var rand = Math.floor(Math.random() * size);
var temp = e.get(rand); // grab a random div from #parent
replace.append(temp); // add the selected div to new container
e = e.not(temp); // remove our selected div from #parent
size--;
}
$('#parent').html(replace.html()); // add shuffled divs to #parent
}
调用谎言:shuffle('#parent .divclass')
所有具有 divclass
类的 Div 都在 #parent
中
我认为它应该像这样开始
function shuffle() {
$(".shuffledv").each(function() {
然后执行某种形式的原始功能,但此时我完全迷失了方向。我不知道如何从这里前进。如果您需要更多信息,请告诉我。
最佳答案
看看this jsfiddle .本质上,我们所做的是为每个容器 shuffledv
div 找到所有子 div 并将它们存储在列表中,然后我们将它们从 DOM 中删除,例如:
$(".shuffledv").each(function(){
var divs = $(this).find('div');
for(var i = 0; i < divs.length; i++) $(divs[i]).remove();
然后我从 here 中获取了 Fisher-Yates 洗牌算法随机化我们的 div 列表,最后我们将它们追加回父容器,如下所示:
for(var i = 0; i < divs.length; i++) $(divs[i]).appendTo(this);
希望这对您有所帮助!
关于javascript - 将所有具有相同类别的 DIVS 打乱,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13427287/