2013-06-20 77 views
0

可能是一個問題已經回答了這樣的問題,但經過一段時間的搜索,我找不到匹配此模式的權威答案。我需要一個更短的訪問我的jQuery插件方法

因此,在最基本的層面上我的插件看起來像下面的,所有我希望能夠做到一旦元素已穿過這是能夠有一個簡短的參考插件的方法是這樣的:

元件上初始化插件:

$('#myElement').myPlugin({ options }); 

然後訪問的方法:

$('#myElement').myPlugin('myFirstMethod', { params }); 

這裏的插件殼:

;(function($) { 
    "use strict"; 
    var plugin = {}; 
    var defaults = { 
     myDefault:  'some_value' 
    }; 

    $.fn.myPlugin = function(options){   

     if(this.length > 1){ 
      this.each(function(){$(this).myPlugin(options);}); 
      return this; 
     } 

     var myplugin = {}; 
     var element = this; 
     plugin.element = this; 

     var init = function() { 
      myplugin.settings = $.extend({}, defaults, options); 
      // Other init stuff here 
     }; 

     form.myFirstMethod = function(){ 
      // Do something 
     }; 

     form.mySecondMethod = function(){ 
      // Do something else 
     }; 

     init(); 
     return this; // returns the current jQuery object 

    } 

})(jQuery); 

同樣,我確定這個問題必須在某個地方回答。我只需要對這些方法進行「最短」的訪問。

謝謝。

回答

2

就我個人而言,我討厭通過pluginName('method', 'params')調用方法,因爲它不會給你JavaScript提供的完整工具包。另外,我不喜歡爲了兩個不同的目的調用相同的方法。在你的情況下,你需要$().myPlugin()初始化和$().myPlugin("methodName")執行一個方法。對於兩個完全不同的目的,這是一種方法myPlugin()。但是,如果這是你想要滾動的方式,下面的片段應該足夠我相信。

// plugin 
(function($) { 
    var myplugin = function(elm) { 
     this.elm = $(elm); 
    }; 

    myplugin.prototype.myFirstMethod = function() { console.log("firstmethod"); } 
    myplugin.prototype.mySecondMethod = function() { console.log("secondmethod"); } 

    $.fn.myplugin = function() { 
     var myArgs = arguments; 
     return this.each(function() { 
      if (!$(this).data("myplugin")) { 
       $(this).data("myplugin", new myplugin(this)); 
      } 

      var api = $(this).data("myplugin"); 

      if (myArgs.length > 0) { 
       api[myArgs[0]](myArgs[1]); 
      } 
     }); 
    }; 
})(jQuery); 

// init plugin 
$(".foo").myplugin(); 

$(".foo").myplugin("myFirstMethod"); 

,如果你願意,你會想要做的each並執行一個jQuery集合中的每個元素上執行這種方法記住。

這是否行得通?

+0

我絕對不想爲我的插件的每個實例都有一個定義的變量,比如上面的api。如果可以這樣做:'$('#foo')。myFirstMethod(params);'那會更好。 – Tomas

+0

在說出來之前,我試圖擺脫的是:'$('#foo')。data('myPlugin')。myFirstMethod(params);'除非這是我唯一的度假勝地。 – Tomas

+0

這個插件是否適用於許多節點,每個節點都有自己的實例,或者每個頁面只有一個節點? – Nucleon

相關問題