jQuery slideUp (). remove () não parece mostrar a animação slideUp antes de ocorrer a remoção

94

Eu tenho essa linha de JavaScript e o comportamento que estou vendo é que o selectedLidesaparece instantaneamente sem "deslizar para cima". Este não é o comportamento que eu esperava.

O que devo fazer para que os selectedLislides subam antes de serem removidos?

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

Respostas:

197

Pode ser possível consertar colocando a chamada para remover em um argumento de retorno de chamada para slideUp?

por exemplo

selectedLi.slideUp("normal", function() { $(this).remove(); } );
Seanb
fonte
4
Observe que "lento" e "rápido" são as únicas velocidades. Outras velocidades precisam estar em milissegundos ou o padrão será 400. keyframesandcode.com/resources/javascript/deconstructed/jquery/…
bendman
19

Você precisa ser mais explícito: em vez de dizer "isso" (que concordo que deve funcionar), você deve fazer o seguinte:

$("#yourdiv").slideUp(1000, function() {
    $(this).remove();
});
Blake
fonte
2
SORRY = esqueci de remover meu id, deveria ser: $ ('# yourdiv'). SlideUp (1000, function () {$ ('# yourdiv'). Remove ();});
Blake
12
Usar $ (this) em vez de $ ("# yourdiv") é mais otimizado, pois o jQuery não precisa procurar um nó.
MaximeBernard
Usar em $("#yourdiv")vez de $(this)é completamente redundante e não é por isso que este código corrige o problema do OP. Este código corrige o problema porque usa o completeretorno de chamada.
Gavin
8

A maneira mais simples é chamar a função "remove ()" dentro do slideUp como um parâmetro como outros disseram, como este exemplo:

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

É obrigatório chamá-lo dentro da função anônima () para evitar que remove () seja executado antes que o slideUp termine. Outra forma igual é usar a função jQuery "promessa ()". Melhor para quem gosta de código autoexplicativo, como eu;)

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

Usando promessas, você também pode esperar que várias animações sejam concluídas, por exemplo:

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

fonte
1
Eu testei - não remove o elemento após deslizar para cima.
Konstantin Spirin
Oculta efetivamente o elemento, mas não o remove de fato do DOM.
andreszs