Question

在继续执行另一个命令之前，是否还等待jQuery动画完成？

例如，我想淡出/向上滑动一个元素，更改元素中的一些项目，然后将它们淡入/滑回。

如果我一个接一个地放置这些语句，你可以在动画完成之前看到项目发生了变化。

$('#item').fadeOut();
$('#item').html('Changed item');
$('#item').fadeIn();

感谢。

Answer 1

您可以使用从.fadeOut调用的回调方法，例如

$('#item').fadeOut('fast', function() {
    $(this).html('Changed item').fadeIn();
});

或使用底层延迟对象

$('#item').fadeOut('slow').promise().done(function() {
    $(this).html('Changed item').fadeIn();
});

Answer 2

您可以在fadeIn/fadeOut中传递回调。 jQuery docs

$('#item').fadeOut('slow', function(){

     $('#item').html('Changed item');
     $('#item').fadeIn();
});

Answer 3

将回调函数传递给fadeOut。

$("#item").fadeOut(function() { 
                       $(this).html("changed").fadeIn();
                   });

这是你将在基本的jQuery教程中学到的东西。

Answer 4

$('#item').fadeOut('slow', function() { // do your stuff here });