接下來這章要講的就比較簡單了,沒有那麼困難了。這邊要談的是,如何在plugin中引入私有函數。
其實概念上跟JavaScript的物件寫法一樣。私有函式可以再在plugin之無名函式內正常定義,外在的程式碼不會看見我們私有方法。
這邊直接看程式碼會比較容易清楚吧!
index2.html
<html> <head> <title></title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" src="mytoolbox2.js"></script> <script> $(document).ready( function() { $('#myDIV').mytoolbox(); }) </script> </head> <body> <div id="myDIV">Hello jQuery Plugin</div> </body> </html>
|
mytoolbox2.js
;(function( $ ){
$.fn.mytoolbox = function( options ) { var _defaultSettings = { 'var_0' : '22', 'var_1' : '1', 'var_2' : '2'
}; var _settings = $.extend(_defaultSettings, options);
return this.each(function() { TestPrivateFunction($(this),_settings); }); function TestPrivateFunction($Obj,opts){ alert($Obj.html()); alert(opts.var_0); } };
})(jQuery)
|
看到紅色的那段嗎?說簡單點,就是在plugin中宣告一個 function 他就會成為私有函數。
像我這個例子我就把div的內容顯示出來,還有就是把plugin預設參數var_0用對話式窗跳出來。
這樣當程式龐大的時候,就可以把他獨立出來。方便維護。
範例程式:http://www.megaupload.com/?d=C9CJN7KC