来源：自学PHP网 时间：2014-11-29 13:28 作者： 阅读:次
[导读] jQuery凭借其简洁的API，对DOM强大的操控性，易扩展性越来越受到web开发人员的喜爱，经常有人询问一些技巧，因此干脆写这么一篇文章给各位jQuery爱好者，算是抛砖引玉吧。...
|
那么首先我们来简单的看一下最正统的 jQuery 插件定义方式： 复制代码 代码如下: (function ($) { $.fn.插件名 = function (settings) { //默认参数 var defaultSettings = { } /* 合并默认参数和用户自定义参数 */ settings = $.extend(defaultSettings, settings); return this.each(function () { //代码 }); //插件在元素内多次出现 } })(jQuery); 先来看模板中的第一行代码（当然我们要把这一行代码的后半部分给揪出来一起看，不然第一行就完全无意义了）： 复制代码 代码如下: (function ($) { })(jQuery); 这行代码其实是用于创建一个匿名函数。如果你对匿名函数和闭包不了解，将会对这种代码非常疑惑，那么强烈建议您阅读【详谈JavaScript 匿名函数及闭包】这篇文章。 jQuery 的继承方法 $.extend —— $.extend 在jQuery 插件开发中有个很重要的作用，就是用于合并参数。 复制代码 代码如下: $.fn.tip = function (settings) { var defaultSettings = { //颜色 color: 'yellow', //延迟 timeout: 200 } /* 合并默认参数和用户自定义参数 */ settings = $.extend(defaultSettings, settings); alert(settings.input); <br>} jQuery 插件定义第二种方式： 复制代码 代码如下: (function ($) { //插件定义--更换名字 $.fn.tabpanel = function (method) { var methods = $.fn.tabpanel.methods; if (methods[method]) { return methods[method].apply(this, Array.prototype.slice.call(arguments, 1)); } else if (typeof method === 'object' || !method) { return methods.init.apply(this, arguments); } else { } } //支持的方法 $.fn.tabpanel.methods = { //初始化 init: function (p_options) { tabpanelBind(p_options, this); }, add: function (p_options) { addTab(p_options, this); tabpanelBind(p_options, this); // debugger } } function add(p_options) { var _defaults = { id: "" } <br> //内部实现略.........<br> return _index; } <br>})(jQuery);<br><br>调用 $("#team").tabpanel('add',""); 好了，上面介绍的这2种开发方式都是最常用的，小伙伴们先好好学习下吧，后续我们再介绍的更深入些 |
自学PHP网专注网站建设学习,PHP程序学习,平面设计学习，以及操作系统学习
京ICP备14009008号-1@版权所有www.zixuephp.com
网站声明：本站所有视频，教程都由网友上传，站长收集和分享给大家学习使用，如由牵扯版权问题请联系站长邮箱904561283@qq.com
