Question

我有一个简单的每个循环：

 var delay = 0;
$('.triggers a').each(function(){ 
    $(this).delay(delay).animate({
        opacity:1
    },400);
    delay += 50;
});

我想在每个循环结束后做一些代码，这是可行的吗？

我该怎么做？

Answer 1

var delay = 0;
var length = $('.triggers a').length;
$('.triggers a').each(function(i){
    $(this).delay(delay).animate({
        opacity:1
    },400);
    delay += 50;
    if(length == i+1){ alert('Hello') }
});

这应该有效。您可以在那里调用一个函数，它将在每个函数完成时启动。

Answer 2

是的，如果你想在循环之后运行某些东西......

var delay = 0;
$('.triggers a').each(function(){ 
  $(this).delay(delay).animate({
    opacity:1
  },400);
  delay += 50;
});
// more code here

但是如果你想在动画定时器之后做一些事情，那么你可以这样做：

var delay = 0;
$('.triggers a').each(function(){ 
  $(this).delay(delay).animate({
    opacity:1
  },400, function(){
    // more code here
  });
  delay += 50;
});

详细了解animate

Answer 3

您可以通过跟踪动画的链接数量以及完成的数量来完成此操作：

var delay = 0, links = 0;
$(".triggers a").each(function() {
    $(this).delay(delay).animate({opacity:1},400,function() {
        links--;
        if( links == 0) {doSomething();}
    });
    links++;
    delay += 50;
});

此技术对于预加载器（尤其是图像预渲染器）也很有用，在这些预加载器中，您可以计算有多少图像以及有多少图像在触发“下一步做什么”功能之前触发了它们onload事件。

每个循环结束时做一些事情

3 个答案: