jquery_自定义插件开发.docx

jquery 自定义插件开发 jQuery 插件的开发包括两种: 一种是类级别的插件开发, 即给 jQuery 添加新的全局函数,相当于给 jQuer y 类本身添加方法。jQuery 的全局函数就是属于 jQuery 命名空间的函数,另一种是对象级别的插件开发,即给 jQuery 对象添加方法。下面就两种函数的开发做详细的说明。 1 、类级别的插件开发类级别的插件开发最直接的理解就是给 jQuery 类添加类方法,可以理解为添加静态方法。典型的例子就是$.AJAX() 这个函数, 将函数定义于 jQuery 的命名空间中。关于类级别的插件开发可以采用如下几种形式进行扩展: 添加一个新的全局函数添加一个全局函数,我们只需如下定义: view plain =function() { ('This isatest. This isonly atest.'); 3.}; 增加多个全局函数添加多个全局函数,可采用如下定义: view plain =function() { ('This isatest. This isonly atest.'); 3.}; =function(param) { ('This function takes aparameter, which is"'+ param +'".'); 6.}; :();(); 或者$.foo();$.bar('bar'); 调用时和一个函数的一样的:();(); 或者$.foo();$.bar('bar'); 使用 (object); view plain ({ : function() { ('This isatest. This isonly atest.'); 4.}, : function(param) { ('This function takes aparameter, which is"'+ param +'".'); 7.}8.}); 使用命名空间虽然在jQuer y命名空间中,我们禁止使用了大量的javaScrip t函数名和变量名。但是仍然不可避免某些函数或变量名将于其他 jQuery 插件冲突,因此我们****惯将一些方法封装到另一个自定义的命名空间。 view plain ={ :function() {('This isatest. This isonly atest.'); 4.}, :function(param) { ('This function takes aparameter, which is"'+ param +'".'); 7.}8.}; ,调用时采用的方法: 10. $.(); 11. $.('baz'); 通过这个技巧(使用独立的插件名),我们可以避免命名空间内函数的冲突。 2 、对象级别的插件开发对象级别的插件开发需要如下的两种形式: view plain 1: 代码 4.(function($){ 5.$.({ :function(opt,callback){ 7.//Our plugin implementation code goes here. 8.}9.}) 10. })(jQuery); 11. 12. 形式 2: 13. (function($) {14. $. =function() { 15. //Our plugin implementation code goes here. 16. }; 17. })(jQuery); 上面定义了一个 jQuery 函数,形参是$,函数定义完成之后,把jQuery 。这样的好处是,我们在写 jQuery 插件时,也可以使用$ 这个别名,而不会与 prototype 引起冲突. 在 JQuery 名称空间下申明一个名字这是一个单一插件的脚本。如果你的脚本中包含多个插件,或者互逆的插件(例如: $.() 和$.() ),那么你需要声明多个函数名字。但是,通常当我们编