本文實例講述了打造自己的jQuery插件的方法。分享給大家供大家參考,具體如下:
寫js插件并不麻煩,js插件有兩類,類型插件和對象插件。首先舉例:
$.post(url);
這個是類型插件,換句話說該插件在調用的時候不需要指定對象。那么:
$('p').click();這個是對象插件,也就是說使用該插件的時候需要指定對象。
在寫jQuery插件的時候,都是有固定的模板:
jQuery.plugin1 = function(text) { alert(text);};//類型級別框架,類似 $.post();$.fn.plugin2 = function(options) { var defaults = { text: 'Hello, world!' }; // 合并默認值 var opts = $.extend(defaults, options); // 你的代碼寫到這里 alert(opts.text);};//對象級別框架,類似 $(this).click();以上就是plugin1是類型級別插件用的時候直接調用就可以了,plugin2是對象級別框架,使用的時候也需要對象。
在寫類型級別框架的時候,jQuery.plugin1中的jQuery.不能省略,同樣在寫對象級別框架的時候,$.fn.也是不能省略的。
這里我要說的時候對象級別框架中 var opts = $.extend(defaults, options);這句話一定要有,這句話的意思就是合并參數。當用戶沒有設置參數的時候使用默認值中的參數,否則就用用戶設置的參數。下面我們看一下調用方法:
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script><script type="text/javascript" src="./myplugin.js"></script><script type="text/javascript">$.plugin1('Hello');$(document).ready(function(){ $('#tmp').click(function(){ $(this).plugin2({ text: '//m.survivalescaperooms.com' }); });});</script>首先在使用自己的jQuery插件的時候,需要包含進來,同時之前要包含jQuery,你懂的。后面就是調用方法了哦!
更多關于jQuery相關內容感興趣的讀者可查看本站專題:《jQuery窗口操作技巧總結》、《jQuery拖拽特效與技巧總結》、《jQuery常用插件及用法總結》、《jquery中Ajax用法總結》、《jQuery表格(table)操作技巧匯總》、《jQuery擴展技巧總結》、《jQuery常見經典特效匯總》、《jQuery動畫與特效用法總結》及《jquery選擇器用法總結》
希望本文所述對大家jQuery程序設計有所幫助。
新聞熱點
疑難解答