Wie warten, bis jQuery-Effekte beendet sind?

Question

Wie kann ich warten, bis eine Animation in jQuery beendet ist?

function foo() { 
    $("#element").fadeOut(); 
} 

muss ich die .fadeOut() vor foo() wieder abgeschlossen werden, da der aufrufende Code die DOM erwartet frei von #element zu sein.

Answer 1

Alle jQuery-Animationsfunktionen haben einen complete Rückruf. Weil sie asyncronous sind, können Sie für sie nicht warten, Sie müssen Rückrufe verwenden.

function foo() { 
    $("#element").fadeOut(function() { 
     // finished 
    }); 
} 

Answer 2

jQuery definiert fadeout als: .fadeOut([duration ] [, complete ]), so einen Rückruf verwenden sollte gut funktionieren.

complete Typ: Function() Eine Funktion, die aufgerufen wird, sobald die Animation abgeschlossen ist, wird einmal pro übereinstimmendem Element aufgerufen.

Answer 3

eine Callback-Funktion für dieses

function foo() { 
    $("#element").fadeOut('slow', function(){ 
    // called when the element finishes fading out 
    }); 
} 

Answer 4

Verwenden Sie nicht foo von der Rückkehr, bevor die Animation beendet verhindern kann. Sie müssen das Callback- oder Promise/Deferred-Muster verwenden. Hier ist, wie ein Rückruf funktionieren könnte.

function bar() { 
    foo(function() { 
     // stuff to execute after foo() 
    }); 
} 

function foo(callback) { 
    $("#element").fadeOut('speed', callback); 
} 

Answer 5

$('#element').fadeOut(1000, function() { 
    // after 1 second do something 

});