学习参考网址整理:
http://blog.csdn.net/chenxi1025/article/details/52222327
http://www.cnblogs.com/ellisonDon/archive/2012/08/12/2634503.html
jquery插件的开发包括两种:
1、类级别插件开发:给jquery类添加类方法,可理解为添加静态方法;例如$.AjAX()函数;
//定义全局函数
$.foo = function(){};
$.bar = function(){};
//$.foo();$bar();
//使用extend定义全局函数
$.extend({
foo : function(){
},
bar : function(){
}
});
//$.foo();$bar();
//使用命名空间定义全局函数
$.plugin = {
foo : function(){
}
}
//接受参数控制插件的行为
(function($){
$.popShow = function(options){
var default = {
id : "",
url : "",
title : ""
};
var settings = $.extend({},default,options);//利用extend把default的对象的方法属性整合到options中;
//此处不需要this.each(function(){});
//执行代码
var _id = settings.id,
_url = settings.url,
_title = settings.title;
$(_id).closet(".popWrap").hide();
//...
};
//调用方法:$.popShow({
id : ".close",
url : "",
title : "编辑"
});
})(jQuery);
//$.plugin.foo();
2、对象级别插件
//形式一
(function($){
$.fn.foo = function(){};
})(jQuery);
$.fn.foo = function(){};
//形式二
(function($){
$.fn.extend({
foo : funciton(){};
})
})(jQuery);
//接受参数控制插件的行为
(function($){
$.fn.popShow = function(options){
var defaults = { //配置项
url : "",
title : ""
};
var settings = $.extend({},defaults,options);// 这个是利用extend方法把 defaults对象的方法属性全部整合到 options里
this.each(function(){
//$.fn.abc()这种实例化方法才需要有this.each循环给多个相同类名的元素绑定此方法里面的事件;// $("div").abc();
var tag = $(this); //调用方法时为$("#div").popShow(); 此处的$(this)相当于$("#div");
//执行代码
return this;
});
};
})(jQuery);