1

如果我有一个 div 可以清除其中的内容，但又想在其中放一些新的东西，我该如何将这些函数串起来，以便只有在前一个函数完成后才会触发

$('#nner_container').fadeOut(300, function(){

    $('#header_div').after('<div id="inner_container" style="dispay:none"></div>');
       //when this insertion of inner_container completes, fill it with some content
       //and when that completes, fadeIn inner_container

});

大多数 jquery 函数似乎都将附加函数作为最终参数，我认为它正是用于此目的。但不是这样after()。还是我做错了什么。

谢谢

4

3 回答 3

3

添加新 div 后，只需淡入inner_container：

$('#inner_container').fadeOut(300, function(){

    $('#header_div').after('<div id="inner_container" style="dispay:none"></div>');
    $('#inner_container').fadeIn(300);
});

该after函数是同步的，这意味着在前一条语句完成之前，下一条语句不会执行。

另一方面，fadeOut异步fadeIn执行，这意味着下一条语句可能在效果完成之前执行。这就是为什么fadeOutandfadeIn函数需要在效果完成时执行回调。

于 2012-08-29T18:44:03.010 回答
1

如果要替换内容，请尝试 .replaceWith() 函数

于 2012-08-29T18:44:16.930 回答
0

由于.after立即完成，因此不需要（或没有）回调，您可以通过将接下来要执行的操作放在下一行来链接它；

$('#inner_container').fadeOut(300, function(){    
    $('#header_div').after('<div id="inner_container" style="dispay:none"></div>');
    $('#inner_container').fadeIn(300);
});

异步方法通常是可能需要一段时间的方法，例如在这种情况下FadeIn，FadeOut需要一定的时间才能完成。大多数（如果不是全部）不是动画的 DOM 操作函数实际上是同步的，并且可以编码为没有回调的经典代码。

于 2012-08-29T18:44:36.210 回答