在 for 循环中延迟 javascript 代码执行答案

【问题标题】：Delay javascript code execution inside for loop在 for 循环中延迟 javascript 代码执行
【发布时间】：2014-06-02 00:17:24
【问题描述】：

我有以下 for 循环：

for (var i = tileLog.length - 1; i >= 0; i--) {
    $('.' + tileLog[i]).mouseenter();
};

有没有办法延迟循环的每次迭代，以便每 x 毫秒触发一次 mouseenter()？

我试过了：

function doSetTimeout(i) {
    setTimeout(function() { $('.' + i).mouseenter(); }, 250);
}

for (var i = tileLog.length - 1; i >= 0; i--)
  doSetTimeout(tileLog[i]);

这似乎不起作用，它只是延迟了 250 毫秒，然后遍历循环

【问题讨论】：

标签： javascript jquery loops timeout delay

【解决方案1】：

除了使用setTimeout()，您还可以使用setInterval()。

在外部范围内定义一个运行变量（就像你在循环中运行的i）。在每次迭代中，除了调用您的函数外，还要减少运行变量。如果它低于零，则停止 setInterval()``：

var index = tileLog.length - 1,
timer = setInterval( function(){

  $('.' + tileLog[index]).mouseenter();

  index -= 1;
  if ( index < 0 ) {
    clearInterval( timer );
  }
}, 250 );

没有实际的sleep() 函数或类似的东西。也会有问题，因为 JavaScript（在大多数情况下）是单线程的，这样的方法会阻塞渲染线程，从而使您的浏览器无法访问。

【讨论】：

【解决方案2】：

JavaScript 中没有睡眠等。所以你的超时方法是正确的。

var tileLog;
var i = titleLog.length - 1;

function func1() {
   $('.' + tileLog[i]).mouseenter();
   if (--i) {
     window.setTimeout(func1, 250);
   }
}

// and of course start the process
func1();

【讨论】：