javascript - 只调用 jQuery 延续一次，而不是每个元素调用一次

Question

大多数 jQuery 方法具有以下形式:

$elements.doSomething(continuation);

其中 continuation 是在 doSomething 完成后每个元素执行一次的延续。例如，

$("div.foo").fadeOut(function() { alert("One foo has been hidden."); });

每个 foo 淡出后将显示“完成”。

现在，我想在对所有元素执行doSomething之后恰好执行一次延续。如果没有元素匹配，则应立即执行延续。示例:

$("div.foo").fadeOut(... some magic here ... 
                     function() { alert("All foos have been hidden."); });

我显然可以自己实现这个(通过计算调用次数等)，但我想知道:是否有一些内置的 jQuery 已经做到了这一点？

Answer 1

我自己发现的RTFM-ing :

As of jQuery 1.6, the .promise() method can be used in conjunction with the deferred.done() method to execute a single callback for the animation as a whole when all matching elements have completed their animations.

因此，“魔法”看起来像这样:

$("div.foo").fadeOut();
$("div.foo").promise().done(function() { alert("All foos have been hidden."); });

还有一个实际工作示例:

$("div.foo").fadeOut();
$("div.foo").promise().done(function() { alert("All foos have been hidden."); });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="foo">123</div>
<div class="foo">123</div>
<div class="foo">123</div>