如何添加一些jQuery插件完成回調

Question

我的問題是如何

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

添加完成回調是這樣的...

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

添加一些jQuery的普金像這樣的例子...到在我的插件執行其它功能....

：

(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); 

Plz，help !!

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()的每次迭代創建另一個延遲。當所有這些延期申請都得到解決後，請解決您返回的問題。

Answer 2

延遲對象。

(function ($) { 

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

      // defaults 
      var defaults = { 
       padding: 20, 
       mouseOverColor: '#000000', 
       mouseOutColor: '#ffffff' 
      } 
      var options = $.extend(defaults, options); 
      return $.Deferred(function(def){ 
       // the async task 
       setTimeout(function(){ 
        def.resolve(); 
       },5000); 
      }).promise(); 
     } 
    }); 
})(jQuery); 

Answer 3

你的意思是回調？

(function ($) { 

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

      // defaults 
      var defaults = { 
       padding: 20, 
       mouseOverColor: '#000000', 
       mouseOutColor: '#ffffff' 
      }  
      var options = $.extend(defaults, options);  
      return this.each(function() {  
       /** 
       * SOME TASK 
       **/  
      }); 
      if (typeof callback == 'function') { // make sure the callback is a function 
       callback.call(this); // brings the scope to the callback 
      } 
     } 
    }); 
})(jQuery); 

然後使用它像這樣

$('#Div').myPluginLoad({ 
    callback:function(){ 
     //do your thing here 
    } 
});