javascript - 每 n 秒自动洗牌 div

标签 javascript jquery

我这里有我的具有相同类名的随机 div 的代码。现在我需要做的就是每 n 秒(例如 15 秒)将它们随机化一次,而无需刷新页面。 http://jsfiddle.net/yxBhH/

JS代码:

var parent = $("#shuffle");
var divs = parent.children();
while (divs.length) {
    parent.append(divs.splice(Math.floor(Math.random() * divs.length), 1)[0]);
}

有人知道怎么做吗?我还不习惯 javascript,所以非常感谢任何帮助。

最佳答案

您可以使用setInterval 函数:

var $parent = $("#shuffle");
var $divs = $parent.children();

setInterval(function() {
  var $clone = $divs.slice();
  while ($clone.length) {
    $parent.append($clone.splice(Math.floor(Math.random() * $clone.length), 1));
  }
}, 2000);
.hue {
  background: #ddd;
}

.hue:nth-child(2n) {
  background: yellow;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="shuffle">
  <div class="hue">one</div>
  <div class="hue">two</div>
  <div class="hue">three</div>
  <div class="hue">four</div>
</div>

关于javascript - 每 n 秒自动洗牌 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15740601/

相关文章:

jquery - 动态更改jPlayer流源

javascript - 找到没有样式显示的 div,并在每个第二个 div 上插入一个分页样式

javascript - 如何定义图像 'Save As' 大小?

javascript - 这是低效的 JavaScript 吗?

javascript - Jquery 选择一个 Div 并触发另一个隐藏的 div

javascript - react : why the state is updated correctly until the second time?

javascript - SignalR 自定义重定向方法

jquery - 使用 Jquery 查找 block 的高度

javascript - 如果你已经在使用一个框架,你应该永远不要写 "plain vanilla"js 吗?

javascript - 网格底部的固定行