2015-02-09 45 views
0

由於我的插件不使用選擇器調用(不知道這是如何調用的)我想刪除這個。需要幫助修改我的jQuery插件

// my plugin wrapper 
;(function (root, factory) { 
    if (typeof define === 'function' && define.amd) { 
     define(['jquery'], factory); 
    } else { 
     factory(root.jQuery); 
    } 
}(this, function ($) { 
    //"use strict"; // jshint ;_; 
    var pluginName = 'myCustomPlugin'; 
    function Plugin(element, options) { 
     this.obj = $(element); 
     this.o = $.extend({}, $.fn[pluginName].defaults, options); 
     this.init(); 
    }; 

    Plugin.prototype = { 
     init: function() { 
     }, 
     show: function (text) { 
      alert(text); 
     }, 
     destroy: function() { 
      this.obj.removeData(pluginName); 
     } 
    }; 

    $.fn[pluginName] = function (option, param) { 
     return this.each(function() { 
      var $this = $(this); 
      var data = $this.data(pluginName); 
      var options = typeof option == 'object' && option; 
      if (!data) { 
       $this.data(pluginName, (data = new Plugin(this, options))) 
      } 
      if (typeof option == 'string') { 
       data[option](param); 
      } 
     }); 
    }; 

    $.fn[pluginName].defaults = { 
     option1: '', 
     option2: '' 
    }; 
})); 

目前我實例化插件這樣的:

$('body').myCustomPlugin(); 
$('body').myCustomPlugin('show', 'Hello world'); 

我想改變這種使用這種格式:

$.myCustomPlugin(); 
$.myCustomPlugin('show', 'Hello world'); 
+0

有幾個方法可以做到這一點,取決於你在找什麼功能了。你想要一個單身人士,是否可以創建多個實例,或者你只是想在jQuery中命名空間插件? – 2015-02-11 17:34:53

+0

不,我想在頁面上創建多個插件實例。 – user759235 2015-02-11 22:17:22

+1

你的插件做什麼? – 2015-02-11 22:38:29

回答

1

添加一些像這樣

 $[pluginName] = function() { 
      var $body = $(document.body); 
      $body[pluginName].apply($body, arguments); 
     } 

到包裝結束。你會得到

// my plugin wrapper 
    ;(function (root, factory) { 
     if (typeof define === 'function' && define.amd) { 
      define(['jquery'], factory); 
     } else { 
      factory(root.jQuery); 
     } 
    }(this, function ($) { 
     //"use strict"; // jshint ;_; 
     var pluginName = 'myCustomPlugin'; 
     function Plugin(element, options) { 
      this.obj = $(element); 
      this.o = $.extend({}, $.fn[pluginName].defaults, options); 
      this.init(); 
     }; 

     Plugin.prototype = { 
      init: function() { 
      }, 
      show: function (text) { 
       alert(text); 
      }, 
      destroy: function() { 
       this.obj.removeData(pluginName); 
      } 
     }; 

     $.fn[pluginName] = function (option, param) { 
      return this.each(function() { 
       var $this = $(this); 
       var data = $this.data(pluginName); 
       var options = typeof option == 'object' && option; 
       if (!data) { 
        $this.data(pluginName, (data = new Plugin(this, options))) 
       } 
       if (typeof option == 'string') { 
        data[option](param); 
       } 
      }); 
     }; 

     $.fn[pluginName].defaults = { 
      option1: '', 
      option2: '' 
     }; 

     // Call directly from jQuery on 'body' 
     $[pluginName] = function() { 
      var $body = $(document.body); 
      $body[pluginName].apply($body, arguments); 
     } 
    })); 
0

嘗試了這一點:

$.extend({ 
    yourPluginName: function (param1, param2) { 
     // constructor function here 
    } 
});