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); 这样调用方法详细区别见（http://www.jb51.net/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的结构和值都没有变化详细区别见（http://www.jb51.net/article/29591.htm）

　　推荐阅读

　　json的前台操作和后台操作实现代码

例子如下: 复制代码代码如下: <html> <body> <h2>通过 JSON 字符串来创建对象</h3> <p> First Name: <span id="fname"></span><br /> Last Name: <span id="lname"></span><br /> </p> <script type="text/javasc>>>详细阅读

本文标题：jquery插件制作简单示例说明

地址：http://www.17bianji.com/kaifa2/JS/23674.html

1/2 1