在 .each() 完成后调用 jQuery 函数

小编典典

在 .each() 完成后调用 jQuery 函数

all

在 jQuery 中，是否可以在调用（或任何其他类型的迭代回调）完成* 后 调用回调 或 触发事件 。.each() *

例如，我想完成这个“淡入淡出”

$(parentSelect).nextAll().fadeOut(200, function() {
    $(this).remove();
});

在进行一些计算并在$(parentSelect). 如果现有元素仍然对 jQuery 可见并且休眠/延迟任意时间量（每个元素 200
时间）似乎充其量是一个脆弱的解决方案，那么我的计算是不正确的。

我可以轻松地.bind()为事件回调提供必要的逻辑，但我不确定.trigger()在上述迭代完成
后如何干净地调用。显然，我不能在迭代中调用触发器，因为它会触发多次。

在的情况下$.each()，我考虑在 data
参数的末尾添加一些东西（我会在迭代正文中手动查找）但我不想被迫这样做，所以我希望还有其他一些优雅的关于迭代回调控制流程的方法。

阅读 66

2022-07-14

共1个答案

小编典典

@tv 答案的替代方案：

var elems = $(parentSelect).nextAll(), count = elems.length;

elems.each( function(i) {
  $(this).fadeOut(200, function() { 
    $(this).remove(); 
    if (!--count) doMyThing();
  });
});

请注意，.each()它本身是同步的——调用后的语句.each()将仅在.each()调用完成后执行。但是，在迭代中开始
的异步操作.each()当然会以它们自己的方式继续进行。这就是这里的问题：淡化元素的调用是计时器驱动的动画，并且它们按照自己的节奏继续。

因此，上面的解决方案会跟踪有多少元素正在褪色。每次调用.fadeOut()都会获得一个完成回调。当回调注意到它已通过所有涉及的原始元素进行计数时，可以确信所有淡入淡出都已完成，然后采取一些后续操作。

这是一个四年前的答案（在 2014 年的这个时间点）。执行此操作的现代方法可能涉及使用 Deferred/Promise
机制，尽管上述方法很简单并且应该可以正常工作。

2022-07-14