javascript - 等到jQuery动画的回调完成执行

我有一个需要顺序调用某些函数的函数。首先，在DOM节点上调用fadeOut。在回调中，DOM节点已分离。这是功能1。但是，完成之后，我需要调用函数＃2。

所以:

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

以上输出:

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

在调用func2()之前，我需要完成回调。我该怎么做？

这里的工作示例:http://jsfiddle.net/y2vj8/2/

[编辑]:

好的，似乎有必要向您解释为什么我要在回调完成后调用func2()，否则我不希望很快得到答案:(.。
func1淡出div(称为div1)，然后将其与DOM分离。这是一个公开可用的功能。
func2是用户定义的对特定事件的回调(单击其他div，例如div2)。它可能是未定义的，但可能绝对包含任何代码。

单击div2时，将调用func1()，然后对func2()求值，如果它是一个函数，则也会对其进行调用。

如果用户手动调用func1()，则永远不会调用func2()。
func1无法识别div2上的click事件，因此无法检查是否应调用func2。

最佳答案

您可以像这样(jsFiddle)做一些非常愚蠢的事情:

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

};
var func2 = function() {
    console.log('func 2 start');
    console.log('func 2 end');
};
var func1_callback = function(callback) {
    console.log('func 1 callback start');
    $('#fadeOut').detach();
    console.log('func 1 callback end');
    callback.call();
};
func1(func2);

老实说，我可能会考虑重组您的应用程序。我不明白您为什么按照自己的方式去做。

关于javascript - 等到jQuery动画的回调完成执行，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/8469104/