让jQuery等待一个.each函数在下一行执行之前完成？

Question

我有这样的：

$("a.fadeout").click(function(event){ 
    event.preventDefault(); 
    var loc = this.href; 

    //Do this first... 
    $($(".faded").get().reverse()).each(function(i) { 
     $(this).delay(i * 100).fadeOut(); 
    }); 

    //And only then do this.. 
    window.location = loc; 

}); 

如何强制fadeouts前的位置变化来完成？如果它只是一个fadeOut（），我会使用它的回调函数，但由于有很多，我无法弄清楚如何去做。

干杯！ Ben

Answer 1

以下works;

$("a.fadeout").click(function(event){ 
    event.preventDefault(); 

    var loc = this.href; 
    var amount = $($(".faded").get().reverse()).each(function(i) { 
     $(this).delay(i * 100).fadeOut(function() { 
      if (i == amount -1) { 
       window.location = loc; 
      } 
     }); 
    }).length; 
}); 

这是我能想到的最干净的方式。我们存储元素的总量，并检查回调fadeOut是否是最后一次回调被绑定。如果是，则执行重定向。

Answer 2

我来到翻过了同样的问题，请看看这个链接，它会帮助你设计一个新的回调：http://jquery-howto.blogspot.com/2009/11/create-callback-functions-for-your.html

Answer 3

它可以是：

$("a.fadeout").click(function(event){ 
    event.preventDefault(); 
    var loc = this.href; 
    var list = $($(".faded").get().reverse()); 
    var size = list.length; 
    var count = 0; 
    list.each(function(i) { 
     $(this).delay(i * 100).fadeOut(function() { 
      if (++count == size) { 
       window.location = loc; 
      } 
     }); 
    }); 
}); 

Answer 4

欢迎的事件 - 基于非线性的世界async！

$(this).delay(i * 100)创建新的setTimeout()。这并不会导致整个脚本暂停，否则整个浏览器会冻结这段时间。 jQuery提供了一些方法来处理这种问题，但是以这种方式来做这件事是不可能的。每当制作​​时，您都必须进行检查。

$("a.fadeout").click(function(event){ 
    event.preventDefault(); 
    var loc = this.href, 
     $stack = $(".faded").get().reverse(); 

    //Do this first... 
    $($stack).each(function(i) { 
     $(this).delay(i * 100).fadeOut().queue(function() { 
      if($stack.lenght <= i+1) { 
       window.location = loc; 
      } 
     }); 
    }); 
}); 

在jsFiddle上测试它。