JQuery插件開發(fā)示例代碼

更新時間：2013年11月06日 17:05:33 作者：

JQuery插件開發(fā)示例代碼

JQuery 插件開發(fā)：
類級別開發(fā)，開發(fā)新的全局函數(shù)
對象級別開發(fā)，給Jquery對象開發(fā)新方法
一、類級別開發(fā) -定義全局方法

復(fù)制代碼代碼如下:

jQuery.foo = function() {  
    alert('This is a test.');  
}; 

采用命名空間，可以避免命名空間內(nèi)函數(shù)的沖突。

復(fù)制代碼代碼如下:

jQuery.apollo={  
    fun1:function(){  
        console.log('fun1');  
    },  
    fun2:function(){  
        console.log('fun2');  
    }  
}  

二、對象級別開發(fā) -定義jQuery對象方法

復(fù)制代碼代碼如下:

(function($) {     
$.fn.pluginName = function() {   

};   
})(jQuery);  
//插件通過這樣被調(diào)用：  
$('#myDiv').pluginName();  

接受options參數(shù)以控制插件的行為

復(fù)制代碼代碼如下:

(function($){  
    $.fn.fun2=function(option){  
        var defaultOption={  
            param1:'param1',  
            param2:'param2'  
        }  
        $.extend(defaultOption,option);  
        console.log(defaultOption);  
    }  
})(jQuery);  
$(function(){  
    //通過這樣調(diào)用  
    $(&quot;body&quot;).fun2({  
        param1:'new Param1'  
    });  
});  

保持私有函數(shù)的私有性

復(fù)制代碼代碼如下:

 (function($) {    
  // plugin definition    
  $.fn.hilight = function(options) {    
    debug(this);    
    // ...    
  };    
  // private function for debugging  
  //“debug”方法不能從外部閉包進入,因此對于我們的實現(xiàn)是私有的。  
  function debug($obj) {    
    if (window.console &amp;&amp; window.console.log)    
      window.console.log('hilight selection count: ' + $obj.size());    
  };    
//  ...    
})(jQuery);  

您可能感興趣的文章:

JQuery

相關(guān)文章

基于jQuery Circlr插件實現(xiàn)產(chǎn)品圖片360度旋轉(zhuǎn)
Circlr是一款可以對產(chǎn)品圖片進行360度全方位旋轉(zhuǎn)展示的jQuery插件，本文給大家分享一款基于jQuery Circlr插件實現(xiàn)產(chǎn)品圖片360度旋轉(zhuǎn)，大家一起來看看吧
2015-09-09
使用jQuery輕松實現(xiàn)Ajax的實例代碼
在Asp.Net的MVC架構(gòu)中使用jQuery是一件很容易的事情，而使用jQuery實現(xiàn)Ajax更加簡單。
2010-08-08
Jquery 數(shù)據(jù)選擇插件Pickerbox使用介紹
目前市面上很少見或幾乎沒有這數(shù)據(jù)(對象)選擇插件.比如,點擊input , select 元素時彈出div(窗口),載入數(shù)據(jù)讓用戶選擇數(shù)據(jù),選擇后在填充回對應(yīng)的元素.
2012-08-08
jquery插件Jplayer使用方法簡析
這篇文章主要介紹了jquery插件Jplayer使用方法簡析，具有實用價值，感興趣的小伙伴們可以參考一下
2016-04-04
jquery Validation表單驗證使用詳解
功能強大的 jquery 表單驗證插件，適用于日常的 E-mail、電話號碼、網(wǎng)址等驗證及 Ajax 驗證，除自身擁有豐富的驗證規(guī)則外，還可以添加自定義的驗證規(guī)則。兼容 IE 6+, Chrome, Firefox, Safari, Opera 10+
2015-04-04
jQuery中[attribute=value]選擇器用法實例
這篇文章主要介紹了jQuery中[attribute=value]選擇器用法,實例分析了[attribute=value]選擇器的功能、定義及給定屬性及屬性值元素的使用技巧,具有一定參考借鑒價值,需要的朋友可以參考下
2014-12-12
解決jquery中美元符號命名沖突問題
在Jquery中，$是JQuery的別名，所有使用$的地方也都可以使用JQuery來替換,下面為大家介紹下如何解決jquery中美元符號命名沖突問題
2014-01-01
jQuery實現(xiàn)左側(cè)導(dǎo)航模塊的顯示與隱藏效果
這篇文章主要介紹了jQuery實現(xiàn)左側(cè)導(dǎo)航模塊的顯示與隱藏效果,涉及jQuery相應(yīng)鼠標事件動態(tài)操作頁面元素樣式的相關(guān)技巧,需要的朋友可以參考下
2016-07-07
jQuery實現(xiàn)的鼠標拖動畫矩形框示例【可兼容IE8】
這篇文章主要介紹了jQuery實現(xiàn)的鼠標拖動畫矩形框,結(jié)合實例形式分析了jQuery基于事件響應(yīng)及頁面元素屬性動態(tài)操作實現(xiàn)的圖形繪制相關(guān)操作技巧,需要的朋友可以參考下
2019-05-05
jQuery+slidereveal實現(xiàn)的面板滑動側(cè)邊展出效果
WEB開發(fā)中有時需要在頁面上設(shè)置一個控制面板，默認是不顯示的，當用戶有需要時可以通過按鈕觸發(fā)調(diào)用面板展示。常見的有頁面?zhèn)冗吇雒姘逍Ч１疚膶⑹褂胘Query插件并結(jié)合實例給大家介紹一下面板滑動展示效果。
2015-03-03