10分鐘學會寫Jquery插件實例教程
更新時間：2014年09月06日 15:47:47 投稿：shichen2014
這篇文章主要介紹了10分鐘學會寫Jquery插件,通過一個實例分兩步完成一個簡單的插件,非常實用,需要的朋友可以參考下
有很多朋友都用過jquery插件，但是很少有人自己動手寫過jQuery插件，本文就以實例形式簡單敘述了jQuery插件的實現(xiàn)方法。分享給大家供大家參考之用。具體方法如下：
具體而言，其實就是把一些常用、實用、通用的功能封裝起來而以，簡單的來講就是把這些代碼放在一個方法里面，可以達到重復使用的效果，這樣就可以不需要每次要用此功能的時候都去重新寫一遍。
現(xiàn)在Jquery里面加入了插件的概念，只要按照它特定的格式當作平時寫function一樣去寫就可以了，不雖然搞得太復雜的。信不信由你們，反正我信了。
接下來用簡單的代碼來講解一下，如果大家看了還不會寫插件的話，我只能表示無語了
具體步驟如下：
第一步：定義插件
$(function() {
$.fn.插件名稱 = function(options) {
var defaults = {
Event : "click", //觸發(fā)響應事件
msg : "Holle word!" //顯示內(nèi)容
};
var options = $.extend(defaults,options);
var $this = $(this); //當然響應事件對象
//功能代碼部分
//綁定事件
$this.live(options.Event,function(e){
alert(options.msg);
});
}
});
第二步：調(diào)用插件
$(function() {
//綁定元素事件
$("#test").插件名稱({
Event : "click", //觸發(fā)響應事件
msg : "插件原來就是這么簡單!" //顯示內(nèi)容
});
});
至此，最簡單的插件搞定！10分鐘不到！相信大家應該都看懂了吧！jQuery插件原來就這么簡單。
相關(guān)文章
下面小編就為大家?guī)硪黄狫query元素追加和刪除的實現(xiàn)方法。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-05-05
Javascript 鏈式調(diào)用實現(xiàn)代碼(參考jquery)
謂的鏈式調(diào)用無非是一個語法技巧而已，我就學Jquery寫了一個粗淺的庫。2010-05-05
近日項目中要做一個鼠標拖拽層的效果，于是手動使用Jquery做了一個，發(fā)出來跟大伙兒分享一下，并希望能得到高手的指點,如何有高手改進的話，在下不勝感激2012-12-12
jquery讀取xml文件實現(xiàn)省市縣三級聯(lián)動的方法
這篇文章主要介紹了jquery讀取xml文件實現(xiàn)省市縣三級聯(lián)動的方法,涉及jQuery操作XML文件及Ajax動態(tài)加載的技巧,需要的朋友可以參考下2015-05-05
這篇文章主要為大家詳細介紹了jQuery實現(xiàn)簡單的輪播圖效果，實現(xiàn)自動播放，能手動切換，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-09-09
很多朋友不清楚(function(){... })();這幾種寫法各代表是什么意思，下面小編通過本教程給大家簡單介紹下(function(){... })();知識，感興趣的朋友跟著小編一起學習吧2016-08-08
textarea的手動換行會產(chǎn)生換行標志，但這個標志存在卻看不到，存入數(shù)據(jù)庫中后讀出來顯示在頁面上卻不會換行，如何處理呢？2011-02-02
Lazy Load是一個用 JavaScript 編寫的jQuery插件. 它可以延遲加載長頁面中的圖片. 本文對它進行實例介紹，具有很好的參考價值，下面跟著小編一起來看下吧2016-12-12
最近做項目時碰到一個需求，就是在移動端支付頁面點擊支付按鈕彈出一個支付鍵盤，類似于支付寶的那種。項目只是單純的手機網(wǎng)站，所以這個功能由前端來實現(xiàn)，下面小編給大家?guī)砹薺Query仿移動端支付寶鍵盤的實現(xiàn)代碼，需要的朋友參考下吧2018-08-08
隨著WEB2.0及ajax思想在互聯(lián)網(wǎng)上的快速發(fā)展傳播，陸續(xù)出現(xiàn)了一些優(yōu)秀的Js框架，其中比較著名的有Prototype、YUI、jQuery、mootools、Bindows以及國內(nèi)的JSVM框架等2011-01-01