如何編寫自己的jquery插件 Jquery的插件主要分為三類：1、封裝對(duì)象方法的插件：大部分插件都是封裝對(duì)象的插件2、封裝全局函數(shù)的插件：將獨(dú)立的函數(shù)添加到j(luò)query的命名空間之下。Jquery.ajax()和jquery.trim()就是jquery內(nèi)部作為全局函數(shù)的插件添加到內(nèi)核上去的。3、選擇器插件：擴(kuò)充自己喜歡的一些選擇器。  編寫Jquery插件的基本要點(diǎn)： 、一般命名的時(shí)候最好是按照jquery.[插件名].js命名。 、所有的對(duì)象都應(yīng)當(dāng)附加到j(luò)query.fn對(duì)象上，所有的全局函數(shù)應(yīng)該附加到j(luò)query對(duì)象本身上 、通過this.each()來便利對(duì)象，這里的this指向的是當(dāng)前選擇器通過選擇器獲取的jquery對(duì)象 、所有的方法或者函數(shù)插件都要以分號(hào)結(jié)尾，否則壓縮的話就會(huì)出現(xiàn)問題，有時(shí)候甚至要在頭部也要加上“;”,以免不規(guī)范的代碼給寫的插件帶來影響。 插件應(yīng)當(dāng)返回一個(gè)jquery對(duì)象，以便可以進(jìn)行鏈?zhǔn)讲僮?，除非你是要返回某個(gè)特定類型的參數(shù)，比如字符串和數(shù)組。 要注意$和jquery兩個(gè)符號(hào)的沖入，可以利用閉包這種技術(shù)來回避這個(gè)問題。  允許使用內(nèi)部函數(shù)，而且，這些內(nèi)部函數(shù)可以訪問他們所在的外部函數(shù)中聲明的局部變量參數(shù)和聲明的其他的內(nèi)部函數(shù)，當(dāng)其中一個(gè)這樣的內(nèi)部函數(shù)在包含他們的外部函數(shù)之外被調(diào)用時(shí)，就會(huì)形成閉包。  “閉包”是一個(gè)很復(fù)雜的概念，對(duì)于編寫jquery插件其實(shí)是有一個(gè)模板的，這個(gè)模板中就有用到閉包的概念。  常見的jquery插件的都是有如下的格式的： ;(function($){     $.fn.yourName= function(options){  //各種屬性、參數(shù) 　　}        var options= $.extend(defaults, options);//定義參數(shù)        this.each(function(){//插件實(shí)現(xiàn)代碼        });     }; })(jQuery); 注解： (1)、“;(function($){    })(jQuery);”使用了匿名函數(shù)，表示在方法體內(nèi)的”$”表示的就是”jquery”,為了有更好的兼容性，所以在前面添加一個(gè)分號(hào) ,這里的$符號(hào)是作為匿名函數(shù)的形參 (2)、$.extend(defaults, options);表示的是如果options中的參數(shù)總是有值的話，那么options中的值將會(huì)代替defaults中的值。舉個(gè)例子來說： Var setting={validate:true,limit:5,name:foo}; Var options={validate:fasle,name:tom}; Var newoptions=$.extend(setting，options)； 那結(jié)果就是newoptions={validate:false,limit:5,name:tom}. 所以Jquery.extend()(或者是$.extend())經(jīng)常來設(shè)置插件的一些默認(rèn)的參數(shù)。 還有就是$.extend()用來擴(kuò)展方法，和jquery.fn.extend()一樣都是可以的，他們的區(qū)別在于：前者不使用jquery的方法，而后者使用了jquery的方法，就像 addClass(),remove()等。所以可想而知大部分的現(xiàn)有插件都是jquery.fn.extend()進(jìn)行擴(kuò)展的。function foo(options){ 　　options=jquery.extend({ 　　Name：“bar”, 　　Length：5， 　　dataType:”xml” 　　},options); }; 如果options參數(shù)傳入的值為空，那么就可以使用默認(rèn)設(shè)置的值。  例子: ;(function($)){ 　　$.fn.extend({ 　　 “functionname”：function(options){//某個(gè)方法名 　　Options=$.extend({ 　　odd:”odd”, 　　even:”even” 　　},options); 　　//可以通過options.元素名稱來獲取元素之，如options.odd 　　//some codes 　　$(“.table”).addClass(“”);//為某個(gè)元素添加樣式等等 　　} 　　//一個(gè)方法結(jié)束 　　//另一個(gè)方法 this.cleartb = function() {//同時(shí)你也可以這么寫，這里cleartb就是方法的名稱     $('#emed_tb01').remove();//方法要做的事情 } 　　}); }  那我們?cè)谑褂玫臅r(shí)候就可以： $(“#id_”).cleartb();//選中id為“id_”的元素執(zhí)行上面插件中的cleartb的方法。  下面給出一個(gè)完整的插件的例子供參考：這個(gè)插件是一個(gè)消息提示的插件，   ;(function($){     $.fn.manhuaTip= function(options) {//擴(kuò)展函數(shù)manhuaTip         var defaults= {//默認(rèn)值             Event :"click",             timeOut :2000         };         var options= $.extend(defaults,options);//以傳參覆蓋         var $tip= $(this);//選定操作的jquery元素為當(dāng)前選中的元素         $tip.live(options.Event,function(e){                 vartype = $(this).attr('ty');                     var msg= $(this).attr('msg');               var tipHtml= '';    if (type =='loading'){                 tipHtml= ''+(msg ? msg : '正在提交您的請(qǐng)求，請(qǐng)稍后...');             }else if (type =='notice'){                 tipHtml= ''+msg             }else if (type =='error'){                 tipHtml= ''+msg             }else if (type =='succ'){                 tipHtml= ''+msg             }    if ($('.msgbox_layer_wrap')) {                                  $('.msgbox_layer_wrap').remove();             }    if (st){                 clearTimeout(st);             }             $("body").prepend("
"+tipHtml+"
");             $(".msgbox_layer_wrap").show();             var st= setTimeout(function (){                 $(".msgbox_layer_wrap").hide();                 clearTimeout(st);             },options.timeOut);         });         }       })(jQuery)