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);
});

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

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