jQuery when（）。done（）无法正常工作

Question

我需要运行一些动画链。 我尝试使用以下代码，但始终将second（）与first（）同时运行

例子一：

var first = function(){
    var d = new $.Deferred();
    $('#ajax-contract-info').fadeOut(1400, function() {
                    $('#ajax-contract-info').removeClass('in');
                    $('#ajax-contract-info').css('display', '');
                    d.resolve();
            });
    return d.promise();
};

var second = function() {
    var d = new $.Deferred();
    $('#ajax-other-fields').fadeIn(1400, function() { d.resolve() });
    return d.promise();
};

$.when(first())
.done(second());

示例二：

var first = function(){
    return $('#ajax-contract-info').fadeOut(1400, function() {
                    $('#ajax-contract-info').removeClass('in');
                    $('#ajax-contract-info').css('display', '');
            }).promise();
};

var second = function() {
    return $('#ajax-other-fields').fadeIn(1400, function() { d.resolve() }).promise();
};

$.when(first())
.done(second());

哪里有错？

PS我知道，我可以在动画调用中使用“完成”设置，但是我在条件列表较大的情况下会遇到很多动画，使用“完成”设置会使代码不可读。

Answer 1

.done(second()) 调用 second并将其返回值传递给done ，就像foo(bar())调用bar并将其结果传递给foo 。 您只想传递函数引用，所以省去() ：

$.when(first())
.done(second);
// No () ---^

您也可以只在first()上使用then ，而无需$.when除非您将并行的promise组合在一起：

first().then(second);

如果您有第三个，则可以将其链接到末尾，由于second返回了承诺，所以它将等待second完成：

first().then(second).then(third);