jQuery 插件开发指南

那么首先我们来简单的看一下最正统的 jQuery 插件定义方式:

代码如下:
插件名 = function (settings) { //认参数 var defaultSettings = {

} / 合并认参数和用户定义参数 /

settings = $.extend(defaultSettings,settings);

return this.each(function () { //代码 }); //插件在元素内多次出现

} })(jQuery);

先来看模板中的第一行代码(当然我们要把这一行代码的后半部分给揪出来一起看,不然第一行就完全无意义了):

代码如下:
})(jQuery);

这行代码其实是用于创建一个匿名函数。如果你对匿名函数和闭包不了解,将会对这种代码非常疑惑,那么强烈建议您阅读【】这篇文章。

jQuery 的继承方法 $.extend —— $.extend 在jQuery 插件开发中有个很重要的作用,就是用于合并参数。

代码如下:
默认参数和用户定义参数 */ settings = $.extend(defaultSettings,settings); alert(settings.input);
}

jQuery 插件定义第二种方式:

代码如下:
插件定义--更换名字 $.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: ""
}

    //内部实现略.........
return _index;
}

})(jQuery);

调用 $("#team").tabpanel('add',"");

好了,上面介绍的这2种开发方式都是最常用的,小伙伴们先好好学习下吧,后续我们再介绍的更深入些

相关文章

页面搜索关键词突出 // 页面搜索关键词突出 $(function () {...
jQuery实时显示日期、时间 html: <span id=&quot...
jQuery 添加水印 <script src="../../../.....
中文:Sys.WebForms.PageRequestManagerParserErrorExceptio...
1. 用Response.Write方法 代码如下: Response.Write(&q...
Jquery实现按钮点击遮罩加载,处理完后恢复 思路: 1.点击按...