jquery外掛程式開發通用框架

2021-09-07 13:14:49 字數 1083 閱讀 4609

2017-07-24 更新:增加單例模式。

jquery外掛程式開發框架**

/*

* 外掛程式編寫說明:

* 1、外掛程式命名:jquery.[外掛程式名].js,如jquery.plugin.js

* 2、物件方法新增到jquery.fn上,全域性方法新增到jquery物件本身上

* 3、外掛程式內部的this指向通過選擇器獲取的jquery物件

* 4、可以使用this.each遍歷所有的元素

* 5、所有的方法以分號結束;外掛程式頭部先新增乙個分號

* 6、外掛程式應該返回乙個jquery物件,以保證外掛程式的鏈式操作

* 7、使用閉包形式,使用$作為jquery的別名以避免衝突

* 8、單例模式 */

//為了相容性良好,開始前有個分號;//

傳入jquery是為了確保在匿名函式中正確的使用jquery物件,防止多庫共存時$衝突

//傳入window、document並非必須,只不過為了更快的訪問window和document

//獲得沒有未被修改的 'undefined',因為實際並沒有傳遞這個引數。

(function

($, win, doc, undefined) ;

//根據傳入的引數擴充套件預設引數

if(opts &&$.isplainobject(opts))

//呼叫函式方法

_self.show(_self.opts);

};//函式方法實現

alertplugin.prototype =

}//擴充套件外掛程式

$.fn.extend(

});}

});})(jquery, window, document);

//jquery,window,document作為實參

外掛程式呼叫

//未傳遞引數的呼叫

$('.a').alertplugin();

//傳遞引數的呼叫

$('.a').alertplugin();

jQuery 外掛程式開發

一 類級別的外掛程式開發 即給jquery新增新的全域性函式,相當於給jquery類本身新增方法,jquery的全域性函式就是屬於jquery命名空間的函式。1 新增全域性函式 方法一 jquery.onetest function jquery.twotest function 方法二 jquer...

jquery 外掛程式開發

自定義主要通過兩種方式實現 extend fn.extend 呼叫的方法分別是 aa this aa 注意 建立函式時不要放在 function 中,呼叫時候要放在事件裡面 this click function jquery.extend 函式詳解 jquery的extend擴充套件方法 jque...

jquery 外掛程式開發

jquery外掛程式開發一般通過兩種框架方式 一種是在jquery物件上直接定義新成員,形成外掛程式 另一種是封裝完整的外掛程式 然後將jqeury作為引數自身呼叫,達到給jquery物件擴充套件功能目的,形成外掛程式。其實兩種方式都是給jqeury物件擴充套件成員來實現外掛程式功能的,所以本質上功...