javascript - 如何添加一些 jQuery 插件完成回调

Question

我的问题是如何像这个例子一样添加到一些 jQuery pugin...

$('#Div').myPluginLoad();

像这样添加完成回调...

$('#Div').myPluginLoad().done(function(){
    alert('task finished..!!');
});

执行另一个函数....

在我的插件中:

(function ($) {

    $.fn.extend({    
        myPluginLoad: function (options) {    

            //  defaults
            var defaults = {
                padding: 20,
                mouseOverColor: '#000000',
                mouseOutColor: '#ffffff'
            }    
            var options = $.extend(defaults, options);    
            return this.each(function () {    
                /**
                 *    SOME ASYNC TASK
                 **/    
            });
        }
    });
})(jQuery);

请帮忙!!

Answer 1

像这样的东西应该可以工作:

(function ($) {

    $.fn.extend({    
        myPluginLoad: function (options) {    
            var def = $.Deferred();

            //  defaults
            var defaults = {
                padding: 20,
                mouseOverColor: '#000000',
                mouseOutColor: '#ffffff'
            }    
            var options = $.extend(defaults, options);
            var deferredList = [];

            this.each(function () { 
                var innerDef = $.Deferred();
                deferredList.push(innerDef.promise());

                $.ajax({...}) //just for example
                .done(function() {
                    innerDef.resolve();                    
                });
            });

            $.when.apply($, deferredList).done(function() {
               def.resolve(); 
            });

            return def.promise();
        }
    });
})(jQuery);

您需要创建一个延迟对象来返回，表示所有项目何时完成加载。然后，您需要为 this.each() 的每次迭代创建另一个 deferred。当所有这些延迟都已解决后，解决您返回的那个。