--引文--
所以所以,千萬不要寫一堆function然後說在開發jquery套件阿~
<文章列表>
IT人生組文章
--9/20 : IT人的創意
http://ithelp.ithome.com.tw/question/10127866
--9/19 : 程式設計師的成就感
http://ithelp.ithome.com.tw/question/10127573
--9/18 : 你的職業是甚麼?
http://ithelp.ithome.com.tw/question/10127308
--9/17 : 寫程式的習慣
http://ithelp.ithome.com.tw/question/10127036
--9/16 : 各行各業的名人
http://ithelp.ithome.com.tw/question/10126681
開發技術組文章
--9/20 : jQuery套件開發(五),套件的定義
http://ithelp.ithome.com.tw/question/10127881
--9/19 : jQuery套件開發(四),預設值與設定值的差別
http://ithelp.ithome.com.tw/question/10127575
--9/18 : jQuery套件開發(三),true false的判斷
http://ithelp.ithome.com.tw/question/10127297
--9/17 : jQuery套件開發(二),jQuery的套件,開發前該了解的事情~
http://ithelp.ithome.com.tw/question/10127033
--9/16 : jQuery套件開發(一),三十天,我想要分享的東西
http://ithelp.ithome.com.tw/question/10126657
我覺得要寫甚麼東西之前
要先知道自己想要甚麼結果阿?
有名的作者"綠角"大大有說過一句話阿。(不負責引用)
"
如果你問我,甚麼是會開車?
那我覺得把車子平平安安開到目的地。這就是會開車了。
如果你問我,甚麼是理財?
那就是平平安安的把錢匯給本文作者...,那就是算會理財了!。
"
那要寫套件之前當然也要很甲會的針對"套件"這兩個字開出~~~範.疇.
首先官方網站就有針對套件作出解釋http://learn.jquery.com/plugins/
所以所以,千萬不要寫一堆function然後說在開發jquery套件阿~
完全就跟我一模一樣阿~簡直有了一個新名詞叫作撞笨。(笨點一樣)
簡單來說,就是開發jquery object的新方法。
接下來!我們來看看官方網站是怎麼建議咱們來寫jquery套件。
http://learn.jquery.com/plugins/basic-plugin-creation/
這!就是官方建議的"pattern"
果然是官方建議的捏~~厲害厲害~
真的沒看過這個pattern開發的套件(只是basic嘛,別這樣說)
但還是介紹一下這個pattern
(function ( $ ) { //執行了一個立即函式,不會汙染全域變數
$.fn.greenify = function( options ) { //設定套件名稱
/*
$.fn.套件名稱,這樣的做法很類似javascript 針對prototype增加方法的邏輯
反正這樣用了之後,jquery物件就可以有這方法。
我們不深究裡面的程式碼
*/
/*
首先要先注意extend的用法
可以參考黑暗執行緒大大的文章
http://blog.darkthread.net/post-2009-03-01-jquery-extend.aspx
總之就會merge參數物件,後面的會蓋掉前面的。
所以,以此推論,第一個參數物件你可以填上你的預設值
那你傳近來的options物件,就會針對重複的key進行覆蓋
*/
var settings = $.extend({
color: "#556b2f",
backgroundColor: "white
}, options );
/*
selector裡面的集合中每一個物件進來執行下面的程式碼,並return
這個return 其實並不影響你的套件本身
但考慮到jquery的函式都可以進行鏈結
強烈建議要有return才是正確的做法
所以是this.css()這個函式執行完return了this(是一個jquery物件) 然後再被你寫的return傳出去。
有些新手會把這邊的this再用$()包起來一次,實際上是沒有必要的...
*/
return this.css({
color: settings.color,
backgroundColor: settings.backgroundColor
});
};
}( jQuery ));
不過,這樣的pattern有很大的問題。
如果套件裡面要做的事情很多怎麼辦?這樣一來就不能把要做的事情夾在小小的return後面了
假設我的套件是點擊了一個按鈕要出來一個小月曆怎麼辦?
下一次,我們來寫一個套件。這次除了改變一點點CSS屬性之外,還會在畫面上加一點東西。