如何讓jQuery等待效果完成？

Question

我確信我前幾天看過這篇文章，但似乎無法在任何地方找到它。
我有一個​​事件後，我刪除了元素，但jQuery刪除元素之前，它有機會完成淡出。
如何讓jQuery等到元素淡出，然後刪除它？

Answer 1

您可以指定一個回調函數：

$(selector).fadeOut('slow', function() { 
    // will be called when the element finishes fading out 
    // if selector matches multiple elements it will be called once for each 
}); 

Documentation here。

Answer 2

如果您希望切換某個東西，在同一個地方淡出另一個淡出另一個東西，您可以在div上放置{position：absolute}屬性，這樣兩個動畫都會相互重疊，而您在開始下一個動畫之前，不必等待一個動畫結束。

Answer 3

使用jQuery 1.6版本，您可以使用.promise()方法。

$(selector).fadeOut('slow'); 
$(selector).promise().done(function(){ 
    // will be called when all the animations on the queue finish 
}); 

Answer 4

您可以如用$.when()等到promise完成：

var myEvent = function() { 
    $(selector).fadeOut('fast'); 
}; 
$.when(myEvent()).done(function() { 
    console.log('Task finished.'); 
}); 

如果你這樣做，可能還有失敗的請求，那麼你甚至可以更進一步：

$.when(myEvent()) 
    .done(function(d) { 
     console.log(d, 'Task done.'); 
    }) 
    .fail(function(err) { 
     console.log(err, 'Task failed.'); 
    }) 
    // Runs always 
    .then(function(data, textStatus, jqXHR) { 
     console.log(jqXHR.status, textStatus, 'Status 200/"OK"?'); 
    });