- 相关推荐
jQuery插件制作之全局函数使用方法
1、添加新的全局函数
所谓的全局函数，实际上就是jQuery对象的方法，但从实践的角度上看，他们是位于jQuery命名空间内部的函数
(1)添加一个函数，只需要将新函数指定为jQuery对象的一个属性。
jQuery.five =function(){ alert("直接继承方式不一样"); }
调用：复制代码 代码如下:$.five();
(2)添加多个函数
jQuery.five =function(){ alert("直接继承方式不一样"); } jQuery.six =function(){ alert("直接继承方式不一样2"); }
调用：复制代码 代码如下:$.five();$.six();
以上的方法会面临命名空间冲突的风险，为避免这个问题，最好把属于这个插件的所有全局函数，都封装到一个对象中，如下：
//命名空间继承 jQuery.myPlugin ={ one : function(obj){ var object = obj; var id = object.attr("id"); alert(id); }, two : function(){ alert(22); } }
这样其实是为全局函数创建了另一个命名空间:jQuery.myPlugin.
2、添加jQuery对象方法
jQuery中大多数内置的功能都是通过其对象的方法提供的。
jQuery.fn.myMethod= function(){ alert(11); }
调用：复制代码 代码如下:$.fn.myMethod();
注意：jQuery.fn是jQuery.prototype的别名。
实例：以下是行为不正确的方法
11111111111111111111111111
22222222222222222222
333333333333333
4444444444444444455555555555555
6666666666666666
777777777777777777
777777777777777777
jQuery.fn.swapClass= function(class1,class2){ if(this.hasClass(class1)){ this.removeClass(class1).addClass(class2); } if(this.hasClass(class2)){ this.removeClass(class2).addClass(class1); } } $("#swap").click(function(){ $("li").swapClass("this","that"); return false; })
全部li都是用了that样式。
(1)隐士迭代
要在无论匹配多个元素的情况下都保证行为的正确，最简单的方法是始终在方法的环境上调用.each()方法，这样就会
执行隐士迭代，而执行隐士迭代对于维护插件和内置方法的一致性是至关重要的，在调用的.each()方法内部，this
依次引用的是每个DOM元素.以上代码修改为：
jQuery.fn.swapClass= function(class1,class2){ this.each(function(){ var $element = jQuery(this); if($element.hasClass(class1)){ $element.removeClass(class1).addClass(class2); }else if($element.hasClass(class2)){ $element.removeClass(class2).addClass(class1); } }) }
调用：
复制代码 代码如下:$("li").swapClass("this","that")
(2)方法的连缀
要使用方法的连缀，必须在所有的插件方法中返回一个jQuery对象。返回的jQuery对象通常就是this所引用的对象。
jQuery.fn.swapClass= function(class1,class2){ return this.each(function(){ var $element = jQuery(this); if($element.hasClass(class1)){ $element.removeClass(class1).addClass(class2); }else if($element.hasClass(class2)){ $element.removeClass(class2).addClass(class1); } }) }
调用：
复制代码 代码如下:$("li").swapClass("this","that").css("text-decoration","underline");
3、添加新的简写方法
//添加新的简写方法 jQuery.fn.slideFadeOut= function(speed,callback){ return this.animate({ height : "hide", opacity : "hide" },speed,callback) } jQuery.fn.slideFadeIn= function(speed,callback){ return this.animate({ height : "show", opacity : "show" },speed,callback) } jQuery.fn.slideFadeToggle= function(speed,callback){ return this.animate({ height : "toggle", opacity : "toggle" },speed,callback) }
【jQuery插件制作之全局函数使用方法】相关文章：
jQuery 源码分析和Ready函数06-28
excel中if函数的使用方法10-24
excel常用函数使用方法04-26
asp.net+jquery Jsonp使用方法介绍08-23
Excel中vlookup函数使用方法02-17
excel中now函数的使用方法05-25
excel四舍五入函数使用方法06-11