定义 jQuery.each() 循环步骤之间的超时答案

【问题标题】：Define timeouts between steps of jQuery.each() loop定义 jQuery.each() 循环步骤之间的超时
【发布时间】：2014-07-11 02:12:04
【问题描述】：

据我所知，$.each() 是一个同步函数，所以我认为，必须以某种方式——通过某种技术——延迟遍历数组的步骤。

我还没有找到合适的方法。如何正确设置其步骤的超时时间？

更新：

问题，为什么我需要这个，是循环中的步骤数，计算量很大，它们使异步函数太慢。我想为他们节省一些处理器速度，并通过这种延迟定义“优先级”。我在循环的步骤中使用了一个非回调函数，主要是 jQuery.css()。

重要提示：

我正在寻找一种技术来设置 BETWEEN 步骤之间的延迟，以减少计算量，而不是使用循环设置大量超时，按时间运行。

【问题讨论】：

你能准确描述你想要做什么。这个问题是XY问题的定义。
喜欢jsfiddle.net/arunpjohny/mu6JB/1 ?
是的，@RoryMcCrossan，我已经更新了我的问题。

标签： jquery delay synchronous each delayed-execution

【解决方案1】：

我建议不要使用.each()，而是手动循环收集。：

HTML

<div class="foo">A</div>
<div class="foo">B</div>
<div class="foo">C</div>
<div class="foo">D</div>
<div class="foo">E</div>

Javascript

var collection = $('.foo');
if( collection.length > 0 ){
    var i = 0;
    var fn = function(){
        var element = $(collection[i]);
        console.log(i + ' (' + element.text() + ') : %o', element);
        // Do whatever
        if( ++i < collection.length ){
            setTimeout(fn, 5000);
        }
    };
    fn();
}

如果你愿意的话，可以很容易地封装到 $('.foo').delayedEach(5000, function(){}) 扩展中。

Working fiddle

【讨论】：

【解决方案2】：

根据您的情况，这样的方法可能有效：

$('.some-results').each(function(i) {
  $(this).delay(500 * i).someAction();
});

在此示例中，您使用数组的索引号 (i) 使每次迭代比上一次延迟多 500 毫秒。希望这会有所帮助。

注意：如果不清楚， someAction() 可以是您计划对元素执行的任何操作。可以是动画、获取值等。

【讨论】：

据我所知，这不使用任何回调，它只是在步骤中设置超时，而不是在它们之间。

【解决方案3】：

试试这个代码：

HTML

<div class="result"></div>
<div class="result"></div>
<div class="result"></div>

Javascript

$('.result').each(function(i) {
  setTimeout(function(){ alert(i);},5000*i);
});

工作JSFiddle

【讨论】：