如何在jQuery中编写循环,等待每个函数在继续循环之前完成

Question

如果这是显而易见的,请原谅我.

我在页面上有一个未知数量的元素,我需要一次循环一个并执行操作.但是,我需要循环暂停,直到元素上使用的函数完成,然后继续下一次迭代.

我尝试在$ .each循环中执行此操作,但它快速启动命令并完成而无需等待它们完成.

有任何想法吗？

$('elem').each(function(){
    $(this).fadeIn().wait(5000).fadeOut();
});

这就是我所拥有的,非常简单.我从这里得到了wait()函数:jquery cookbook site.

问题是,循环不等待 - 实际命令按预期工作,只是它们一次全部消失.

任何帮助表示感谢,谢谢.

编辑:执行此操作后,我可能希望再次执行循环,以便elems列表将按顺序再次淡入/淡出

EDIT2:从那以后得到了1.4.2 jQuery lib,使用的是1.3.2,因此自定义了wait()函数.现在使用lobstrosity提到的delay().管理从他的答案拼凑出一些接近我需要的东西,感谢lobstrosity :).

Answer 1

首先,jQuery 1.4添加了延迟函数,我假设这是您的自定义等待实现正在执行的操作.

使用延迟,您可以通过使用每个回调的第一个参数作为初始延迟的乘数,来伪装上一个元素"等待"的每个元素的功能.像这样:

var duration = 5000;

$('elem').each(function(n) {
    $(this).delay(n * duration).fadeIn().delay(duration).fadeOut();
});

所以第一个元素会立即淡出.第二个将在5,000毫秒后消失.10,000 ms后的第三个等等.请记住,这是假装它.每个元素实际上都没有等待前一个元素完成.