Javascript 等待jQuery动画'；的回调已执行完毕

我有一个函数需要按顺序调用一些函数。首先，在DOM节点上调用淡出。在回调中，将分离DOM节点。这是函数#1。但是，完成之后，我需要调用函数#2

因此：

上述产出：

func 1 start
func 1 end
func 2 start
func 2 end
func 1 callback start
func 1 callback end

我需要在调用

func2（）

之前完成回调。我该怎么做

此处的工作示例：

[编辑]：

好的，似乎有必要向您解释为什么我希望在回调完成后调用

func2（）

，否则我预计不会很快得到答案：（

func1

淡出一个div（称为div1），然后从DOM中分离is。这是一个公开可用的函数

func2

是用户定义的对特定事件的回调（单击其他div，例如div2）。它可能未定义，但可能包含任何代码

单击div2时，调用

func1（）

，然后计算

func2（）

，如果它是函数，也会调用它

如果用户手动调用

func1（）

，则永远不会调用

func2（）

---

func1

不知道div2上的click事件，因此无法检查是否应该调用

func2

。

由于回调是在正常流之外调用的（我的意思是根据其他操作完成的时间），因此需要在该备用流中钩住

func2

一种方法是从内部调用

func2

，如果由于某种原因无法调用，可以像这样从内部调用

func1

var func1 = function() {
    console.log('func 1 start');
    elt.fadeOut(2000, function(){ callback(); func2(); });
    console.log('func 1 end');
};

---

直接回答

我需要在调用func2（）之前完成回调。我该怎么做

是

---

在调用

func2

之前，必须先调用

callback

。

您可以做一些像这样愚蠢的事情（）：

---

老实说，我可能会考虑重新构造你的应用程序。我不明白你为什么要这样做。

你可以创建一个包装版本的

淡出方法来触发自定义事件：

var _oldfade = $.fn.fadeOut;
$.fn.fadeOut = function(duration, callback) {  
    var el = $(this);
    return _oldfade.call(this, duration, function() {
        callback();
        el.trigger('fadeOut')
    });
}

您可以注册以处理：

elt.bind("fadeOut", func2);

我仍然不清楚为什么不能简单地修改原始回调，但这实现了只在第一次回调完成后运行
func2
的目标

请参见此处的演示（单击
div
启动淡入淡出）：



为什么不查克
func2（）
在回调结束时？相信我，如果我能做到的话，我甚至不会发布这个问题。你可以使用setInterval，每次都检查回调是否完成，但我真的不太喜欢这个主意。你想要func 1 start、func 1 end、func1 callback start、func1 callback end，然后fun2 start func2 end而不调用func1回调中的func2？完全正确。我希望整个func1以及动画的回调在我继续调用任何其他函数（此处为func2）之前完成。
$（“#淡出”）。淡出（2000，func1_回调（回调））；
不注册回调，它会立即执行func1_回调。看看其他答案（出于某种原因）哈哈：D也许，更好的是，你可以在包装函数中顺序调用原始的
回调
和参数
回调
。这样，你就不必修改原始的
回调
函数了。是的，你当然可以这样做我是这样做的，以防回调也有某种动画/延迟，但事实并非如此，所以我不知道我为什么这么做：我有我这样做的理由。不过，你的建议可能是实现我想要的最干净的方式。
var _oldfade = $.fn.fadeOut;
$.fn.fadeOut = function(duration, callback) {  
    var el = $(this);
    return _oldfade.call(this, duration, function() {
        callback();
        el.trigger('fadeOut')
    });
}

elt.bind("fadeOut", func2);