2012-04-20 85 views
1

我有一個插件definedlike這樣:jQuery插件:調用其他插件方法的插件方法?

(function($){ 
    var mymethods = { 
     init: function(opts) { 
      // do some wild awesome magic 
      if (opts.drawtablefirst) $(this).drawtable(); // This doesn't actually work of course 
     }, 

     drawtable: function() { 
      $(this).empty().append($("<table>")); // Empty table, I know... 
     } 
    } 

    // Trackman table 
    $.fn.myplugin = function(method) { 

     if (mymethods[method]) { 
      return mymethods[method].apply(this, Array.prototype.slice.call(arguments, 1)); 
     } else if (typeof method === 'object' || !method) { 
      return mymethods.init.apply(this, arguments); 
     } 
    } 
})(jQuery); 

我希望能夠從init方法調用drawtable的方法,但這種方法是行不通的。我實例化我的插件大多喜歡:

$("div#container").myplugin({drawtablefirst: true}) 

但有時我不想通過drawtablefirst再後來手動調用它,如:

$("div#container").myplugin('drawtable') 

是什麼配置,從而drawtable的最佳方式是一種可訪問的插件方法,但也可以從插件方法本身調用,如init

另外,通過$(this)訪問drawtable中的原始元素似乎不起作用。那裏有什麼合適的方法?

謝謝。

回答

0

該解決方案使用jQuery的UI 1.7+ .widget功能,這裏是一個excellent link to what you get for free

$.widget("notUi.myPlugin",{ 
options:{ 
    drawtablefirst:true, 
    //...any other opts you want 
}, 
_create:function(){ 
    // do some wild awesome magic 
    if (this.options.drawtablefirst){ 
    this.drawtable(); // This actually works now of course 
    } 
}, 
//any function you do not put an underscore in front of can be called via .myPlugin("name", //args) 
drawtable: function() { 
    this.element.empty().append($("<table>")); // Empty table, I know... 
} 
}); 
+0

哦,窗口小部件比UI插件更性感。我會看一看... – Wells 2012-04-20 18:43:41