javascript - jQuery 多种方法等待

Question

有没有办法在循环中等待隐藏函数？我的意思是如果我在 html 中有这个结构:

<div class='example'>
    <span> One </span>
    <span> Two </span>
    <span> Three </span>
<div>

在 js 中我想做这样的事情:

$('.example span').each(function(i, span) {
    $(span).hide('slow');
});

我相信 js 是异步的，所以它不会等待隐藏结束，但也许有一种方法我不知道要等到隐藏动画完成并继续下一个元素？

Answer 1

您可以使用 .delay()在正确的时间运行它们，如下所示:

$('.example span').each(function(i, span) {
  $(span).delay(600 * i).hide('slow');
});

You can give it a try here

我们在这里所做的就是将下一个动画延迟 600 毫秒 ( the "slow" duration ) 乘以它的索引，所以第一个立即开始(基于 0，0*600=0)，第二个在 600 毫秒(第一个应该完成)然后)，第三个在 1200 毫秒，等等。