如何暂停javascript的执行直到jquery淡入淡出完成

我想做这样的事情

Fadein一个涵盖其他部门的部门

将该div的内容更改为其他div

淡出覆盖div并显示其下方的其他div

下面是一个代码：

$pH('#coveringDiv').fadeIn(300);
//want to start doing something now, but only after above fadeIn finishes
adContainer = $pH(currAdBubble).find('.mcc');
$pH(adContainer).empty().html("some html");
$pH('.phAdScroller').attr('kw',keyword);
setTimeout("$pH('#coveringDiv').fadeOut(500);",300);

---

但是发生的是，

fadeIn

和之后编写的代码一起开始。我希望fadeIn下面的代码仅在

fadeIn

完成后才开始。我尝试了一个空的

setTimeout

，但也没用。将该代码放在函数中并在

setTimeout（）

中调用它太奇怪了，因为需要向该函数传递许多参数。那么如何实现这一点呢？

fadeIn

接受一个回调函数，该函数将在

fadeIn

完成后执行：

$pH('#coveringDiv').fadeIn(300, function () {
    //want to start doing something now, but only after above fadeIn finishes
    adContainer = $pH(currAdBubble).find('.mcc');
    $pH(adContainer).empty().html("some html");
    $pH('.phAdScroller').attr('kw',keyword);
    setTimeout("$pH('#coveringDiv').fadeOut(500);",300);
});

试试这个：

$pH('#coveringDiv').fadeIn(300, function() {
    adContainer = $pH(currAdBubble).find('.mcc');
    $pH(adContainer).empty().html("some html");
    $pH('.phAdScroller').attr('kw',keyword);
    setTimeout("$pH('#coveringDiv').fadeOut(500);",300);
});

---

jquery中的大多数定时函数都支持回调，在定时操作完成时调用回调。所以

$pH('#coveringDiv').fadeIn(, 300, function() {
    ... code to execute after the fade completes ...
});

---

fadeIn

的第二个参数是在动画完成时调用的回调，因此

$pH('#coveringDiv').fadeIn(300, anotherFuncName);

或

---

添加500秒的暂停。或者循环倒计时。

动画结束后再加300毫秒。

fadeIn

调用中的函数在

fadeIn

完成后调用，因此不需要再加300毫秒的

setTimeout

。

$pH('#coveringDiv').fadeIn(300, function() {
   // code here
});