JQuery 插件開發:
類級別開發,開發新的全局函數
對象級別開發,給Jquery對象開發新方法
一、類級別開發
定義全局方法
jQuery.foo = function() { alert('This is a test.'); };
採用命名空間,可以避免命名空間內函數的衝突。
jQuery.apollo={ fun1:function(){ console.log('fun1'); }, fun2:function(){ console.log('fun2'); } }
二、對象級別開發
定義插件
(function($) { $.fn.pluginName = function() { }; })(jQuery); //插件通過這樣被調用: $('#myDiv').pluginName();
接受options參數以控制插件的行爲
(function($){ $.fn.fun2=function(option){ var defaultOption={ param1:'param1', param2:'param2' } $.extend(defaultOption,option); console.log(defaultOption); } })(jQuery); $(function(){ //通過這樣調用 $("body").fun2({ param1:'new Param1' }); });
保持私有函數的私有性
(function($) { // plugin definition $.fn.hilight = function(options) { debug(this); // ... }; // private function for debugging //“debug”方法不能從外部閉包進入,因此對於我們的實現是私有的。 function debug($obj) { if (window.console && window.console.log) window.console.log('hilight selection count: ' + $obj.size()); }; // ... })(jQuery);