jquery插件制作简单示例说明


一、先从一个简单的实例,不需要带参数的一个方法开始

复制代码 代码如下:

//创建一个匿名函数
(function($){
//给jQuery附加一个新的方法(详细见备注1)
$.fn.extend({
//插件的名字
MyFirstName: function() {
//迭代当前匹配元素集合
return this.each(function() {
var obj = $(this);
//自己的代码
});
}
});
)(jQuery);

备注1:理解$.fn.extend和$.extend的区别,大概的说前者是将MyFirstName这个方法合并到jquery的实例对象中,例如$(“#txtmy”).add(3,4)这样调用方法,后者是将MyFirstName这个方法合并到jquery的全局对象中,例如$.add(3,4); 这样调用方法
详细区别见(/article/29590.htm)

二、有参数的
复制代码 代码如下:

//创建一个匿名函数
(function($){
//给jQuery附加一个新的方法(详细见备注1)
$.fn.extend({
//插件的名字
MyFirstName: function() {
//定义默认参数
Var parms={
Parms1:1,
Parms2:2
}
//合并用户传的参数和默认参数,返回给options(详细见备注2)
var options = $.extend(defaults, options);
//迭代当前匹配元素集合
return this.each(function() {
//把合并后的参数赋值给o
var o= options;
//迭代当前匹配元素
var obj = $(this);
//自己的代码
});
}
});
)(jQuery);

备注2:var options = $.extend(defaults, options); 意思是把defaults和options合并,如果后者有和前者名称一样的元素,后者覆盖前者,然后合并给defaults,然后defaults赋值给options,如果是var options = $.extend({},defaults, options);那么是把前者和后者合并给{}这个参数,然后赋值给options,defaluts的结构和值都没有变化
详细区别见(/article/29591.htm)



相关阅读:
让Win7飞 合理使用好Win7的功能
word-wrap和word-break解决连续字符自动换行
ASP.NET缓存分析和实践浅析
wininet.dll 修复的几种方法
DedeCms SEO 优化全攻略
jquery 双色表格实现代码
地址栏中的问号有什么作用
IE6-IE7-IE8-FireFox css的浏览器兼容技巧
通过T-SQL语句实现数据库备份与还原的代码
CSS border-width 属性使用教程
ASP函数库7
什么是WEB服务器
点图片上一页下一页翻页效果
菜鸟课堂:Oracle数据库中的字符处理技巧
快速导航

Copyright © 2016 phpStudy | 皖ICP备18014864号-4