製作自己的jQuery Plugin套件

在Web設計的事件點擊(Event Handler)裏，使用link會比button更好用，因為它有hover事件，要用css換底圖都方便。

簡單的Design Pattern就是以下的範例，透過jQuery讀取id作switch判斷。

優質的LinkButton，還要避免短時間雙擊(double click)的問題，這可以透過在click()事件前後埋入data-clicked+setTimeout()來判斷短時間點擊。另外也要避免URL#的問題，這只要記得傳回event.preventDefault()及return false即可。

總是有一些小細節要處理，而且又要重複使用，最好的作法就是包裝成jQuery Plugin。官方的Plugin教學比較陽春一點，此篇中文框架教學比較平易近人，文中不懂的關鍵字查GOOGLE就會有衍生的教學。

比較好的jQuery Plugin框架，應該是要能傳入options設定值，而且也能獨立呼叫裏面的methods才對。例如

建立jQuery Plugin的思路及方法，可以閱讀這篇文章，作者使用plugin prototype來擴增方法，不過它比較不好理解，我會建議觀看jQuery EasyUI LinkButton 的Plugin框架來寫作比較好理解(請自行下載查看其SRC源碼)。雖然EasyUI是一個重度自生html的套件，裏頭寫得很複雜，不過它的Plugin建構式架構是挺好的學習參考，用來實作自己的Plugin很棒。

為了促進對它的Plugin框架初始化的理解，我把它抽取出來去掉不必要的東西，整理如下圖。若你看不懂它在寫什麼，可能是對jQuery API還不甚熟悉，那就先仿照其他別的Plugin框架來實作也是可以的。

最後值得一提的是，包裝jQuery Plugin要注意this的問題，除了$.fn.XXX()這個函式的this是指向jQuery物件外，其餘大部分的this都是指DOM物件。因為DOM物件是JS標準，所以要用它來作內部函式及外部的參數傳延溝通，而不是用jQuery Object來便宜行事.