jQuery的承诺与每个功能（）(jQuery promise in function with e

我试着拨打自己的功能，等到它完成。 过渡结束后，我要开始下一个功能。 请在我的jsfiddle看看http://jsfiddle.net/hrm6w/

在执行console.log（“上完成”）应该CONSOLE.LOG后开始（“承诺结束”），所有的动画已经结束。

而在每个-Object的所有动画之后已经结束我要开始下一动作（功能）。

我认为，诺（） - 功能是我所需要的，但我没有得到这方面的工作。

任何帮助，将不胜感激。

Answer 1:

打了一下，似乎在您需要返回从过渡的承诺。 我修改了一下，但有相同的结果。

本文有助于解释一些概念： http://hermanradtke.com/2011/05/12/managing-multiple-jquery-promises.html

演示： http://jsfiddle.net/lucuma/hrm6w/5/

    (function($) {
    //Transition Out
    $.fn.ajaxTransitionOut = function() {

        var $animators = $('.animate', this);
        $animators.each(function() {
            $(this).animate({
            left: 1000,
            opacity: 0
        }, 400);
        console.log('animating');
                        });
        return $animators.promise().done(function() {
            console.log('promise finished');
        });

    };

})(jQuery);

$(document).ready(function() {
    console.log('starting');
    $.when($('#content').ajaxTransitionOut()).done(function() {
        console.log('upper finished');
    });
    console.log('ending');

});​

Answer 2:

我认为这是这么简单：

(function($) {
    $.fn.ajaxTransitionOut = function() {
        return this.find('.animate').each(function() {
            $(this).animate({
                left: 500,
                opacity: 0
            }, 4000);
        });
    };
})(jQuery);
$.when($('#content').ajaxTransitionOut()).done(function() {
    $('html').css('backgroundColor','#999');
});

小提琴- http://jsfiddle.net/hrm6w/8/

你会看到我改变了常数和终端行动更好地观察过程。

我承认我不完全理解为什么这个工作，但它似乎对所有选定元素的复合承诺是由插件返回（并因此提供给jQuery对象隐含.done()在本方法链）。

我希望这仅适用，因为我们面对的是动画和承诺的默认type是“FX”（见的.promise文档（） ）。

编辑：

您也可以下降.when()并产生一个明确的承诺.promise()在这样的方法链：

$('#content').ajaxTransitionOut().promise().done(function() {
    $('html').css('backgroundColor','#999');
});

该插件保持不变。

文章来源: jQuery promise in function with each()