jQuery slideUp (). remove () scheint die slideUp-Animation vor dem Entfernen nicht anzuzeigen

94

Ich habe diese Zeile von JavaScript und das Verhalten, das ich sehe, ist, dass das selectedLisofort verschwindet, ohne "nach oben zu rutschen". Dies ist nicht das Verhalten, das ich erwartet habe.

Was soll ich tun, damit die selectedLiFolien nach oben zeigen, bevor sie entfernt werden?

selectedLi.slideUp("normal").remove();
Eric Schoonover
quelle

Antworten:

197

Könnte es möglich sein, das Problem zu beheben, indem Sie den zu entfernenden Anruf in ein Rückrufargument für slideUp einfügen?

z.B

selectedLi.slideUp("normal", function() { $(this).remove(); } );
Seanb
quelle
4
Beachten Sie, dass "langsam" und "schnell" die einzigen Geschwindigkeiten sind. Andere Geschwindigkeiten müssen entweder in Millisekunden angegeben werden oder sie werden standardmäßig auf 400 eingestellt. Keyframesandcode.com/resources/javascript/deconstructed/jquery/…
Bendman
19

Sie müssen expliziter sein: Anstatt "dies" zu sagen (was meiner Meinung nach funktionieren sollte), sollten Sie Folgendes tun:

$("#yourdiv").slideUp(1000, function() {
    $(this).remove();
});
Blake
quelle
2
ENTSCHULDIGUNG = Ich habe vergessen, meine ID zu entfernen. Sollte sein: $ ('# yourdiv'). SlideUp (1000, function () {$ ('# yourdiv'). Remove ();});
Blake
12
Die Verwendung von $ (this) anstelle von $ ("# yourdiv") ist optimierter, da jQuery nicht nach einem Knoten suchen muss.
MaximeBernard
Die Verwendung von $("#yourdiv")anstelle von $(this)ist völlig redundant und deshalb behebt dieser Code nicht das Problem von OP. Dieser Code behebt das Problem, da er den completeRückruf verwendet.
Gavin
8

Der einfachste Weg ist das Aufrufen der Funktion "remove ()" in slideUp als Parameter, wie andere gesagt haben, wie in diesem Beispiel:

$("#yourdiv").slideUp("normal", function() {
    $(this).remove();
});

Es ist ein Muss, es innerhalb der anonymen Funktion () aufzurufen, um zu verhindern, dass remove () ausgeführt wird, bevor das slideUp beendet wurde. Eine andere Möglichkeit besteht darin, die jQuery-Funktion "versprechen ()" zu verwenden. Besser für diejenigen, die selbsterklärenden Code mögen, wie ich;)

$("#yourdiv").slideUp("normal").promise().done(function() {
    $(this).remove();
});
xaviqv
quelle
3

Mit Versprechungen können Sie auch warten, bis mehrere Animationen fertig sind, z.

selectedLi.slideUp({duration: 5000, queue: false})
.fadeOut({duration: 3000, queue: false})
.promise().done(function() {
    selectedLi.remove()
})
Berühmte Garkin
quelle
-2
selectedLi.slideUp(200, this.remove);

quelle
1
Ich habe getestet - es entfernt kein Element nach dem Hochrutschen.
Konstantin Spirin
Blendet das Element effektiv aus, entfernt es jedoch nicht aus dem DOM.
andreszs