.each（）完成后调用jQuery函数

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

例如，我要完成此“淡入淡出”操作

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

在进行一些计算之前，在。之后插入新元素$(parentSelect)。如果现有元素仍然对jQuery可见，并且睡眠/延迟一些任意时间（每个元素200个）似乎最好是一种脆弱的解决方案，那么我的计算是不正确的。

我可以轻松地.bind()对事件回调进行必要的逻辑处理，但是我不确定.trigger()在上述迭代完成后如何干净地调用。显然，我无法在迭代内调用触发器，因为它将触发多次。

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

@tv的答案的替代方法：

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

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

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

因此，上面的解决方案可以跟踪淡出了多少个元素。每次调用.fadeOut()都会获得完成回调。当回调函数注意到所有涉及的原始元素都计入了回调时，可以放心地采取所有后续操作，以确保所有衰落都已完成。

这是一个有四年历史的答案（目前为2014年）。一种现代的方法可能涉及使用Deferred / Promise机制，尽管以上操作很简单并且应该可以正常工作。

可能要晚了，但我认为这段代码行得通...

$blocks.each(function(i, elm) {
 $(elm).fadeOut(200, function() {
  $(elm).remove();
 });
}).promise().done( function(){ alert("All was done"); } );

好的，这可能要花一点时间，但是.promise（）也应该实现您所追求的。

承诺文档

我正在从事的项目的示例：

$( '.panel' )
    .fadeOut( 'slow')
    .promise()
    .done( function() {
        $( '#' + target_panel ).fadeIn( 'slow', function() {});
    });

:)

JavaScript是同步运行的，因此您放置的任何内容在完成each()之前都不会运行each()。

考虑以下测试：

var count = 0;
var array = [];

// populate an array with 1,000,000 entries
for(var i = 0; i < 1000000; i++) {
    array.push(i);
}

// use each to iterate over the array, incrementing count each time
$.each(array, function() {
    count++
});

// the alert won't get called until the 'each' is done
//      as evidenced by the value of count
alert(count);

调用警报时，计数将等于1000000，因为直到each()完成警报才会运行。

我发现很多处理数组而不是json对象的响应。我的解决方案是简单地在增加一个计数器的同时对对象进行一次迭代，然后在遍历该对象以执行代码时，可以增加第二个计数器。然后，您只需将两个计数器进行比较即可获得解决方案。我知道这有点笨拙，但到目前为止，我还没有找到更优雅的解决方案。这是我的示例代码：

var flag1 = flag2 = 0;

$.each( object, function ( i, v ) { flag1++; });

$.each( object, function ( ky, val ) {

     /*
        Your code here
     */
     flag2++;
});

if(flag1 === flag2) {
   your function to call at the end of the iteration
}

就像我说的那样，它不是最优雅的，但是它可以正常工作，而且我还没有找到更好的解决方案。

JP，干杯

如果您愿意采取几个步骤，则可能会起作用。不过，这取决于动画的顺​​序。我不认为这应该是一个问题。

var elems = $(parentSelect).nextAll();
var lastID = elems.length - 1;

elems.each( function(i) {
    $(this).fadeOut(200, function() { 
        $(this).remove(); 
        if (i == lastID) {
           doMyThing();
        }
    });
});

关于什么

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

您必须将其余请求排队，以使其正常工作。

var elems = $(parentSelect).nextAll();
var lastID = elems.length - 1;

elems.each( function(i) {
    $(this).fadeOut(200, function() { 
        $(this).remove(); 
        if (i == lastID) {
            $j(this).queue("fx",function(){ doMyThing;});
        }
    });
});

我遇到了相同的问题，并使用以下代码解决了问题：

var drfs = new Array();
var external = $.Deferred();
drfs.push(external.promise());

$('itemSelector').each( function() {
    //initialize the context for each cycle
    var t = this; // optional
    var internal = $.Deferred();

    // after the previous deferred operation has been resolved
    drfs.pop().then( function() {

        // do stuff of the cycle, optionally using t as this
        var result; //boolean set by the stuff

        if ( result ) {
            internal.resolve();
        } else {
            internal.reject();
        }
    }
    drfs.push(internal.promise());
});

external.resolve("done");

$.when(drfs).then( function() {
    // after all each are resolved

});

该解决方案解决了以下问题：使用Deferred对象同步在.each（）迭代中启动的异步操作。

可能是迟到的回复，但是有一个程序包可以处理此 https://github.com/ACFBentveld/Await

 var myObject = { // or your array
        1 : 'My first item',
        2 : 'My second item',
        3 : 'My third item'
    }

    Await.each(myObject, function(key, value){
         //your logic here
    });

    Await.done(function(){
        console.log('The loop is completely done');
    });

我正在使用这样的东西：

$.when(
           $.each(yourArray, function (key, value) {
                // Do Something in loop here
            })
          ).then(function () {
               // After loop ends.
          });