标签:style blog class code java tar
那么首先我们来简单的看一下最正统的 jQuery 插件定义方式:
1
2
3
4
5
6
7
8
9
10
11
12 |
( function
($) { $.fn.插件名 = function
(settings) { //默认参数 var
defaultSettings = { } /* 合并默认参数和用户自定义参数 */ settings = $.extend(defaultSettings, settings); return
this .each( function
() { //代码 }); //插件在元素内多次出现 } })(jQuery); |
先来看模板中的第一行代码(当然我们要把这一行代码的后半部分给揪出来一起看,不然第一行就完全无意义了):
1
2
3 |
( function
($) { })(jQuery); |
这行代码其实是用于创建一个匿名函数。如果你对匿名函数和闭包不了解,将会对这种代码非常疑惑,那么强烈建议您阅读JavaScript中的匿名函数及函数的闭包这篇文章。
jQuery 的继承方法 $.extend —— $.extend 在jQuery 插件开发中有个很重要的作用,就是用于合并参数。
1
2
3
4
5
6
7
8
9 |
$.fn.tip = function
(settings) { var
defaultSettings = { //颜色 color: ‘yellow‘ , //延迟 timeout: 200 } /* 合并默认参数和用户自定义参数 */ settings = $.extend(defaultSettings, settings); alert(settings.input); <br>} |
jQuery 插件定义第二种方式:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31 |
( function
($) { //插件定义--更换名字 $.fn.tabpanel = function
(method) { var
methods = $.fn.tabpanel.methods; if
(methods[method]) { return
methods[method].apply( this , Array.prototype.slice.call(arguments, 1)); } else
if ( typeof
method === ‘object‘
|| !method) { return
methods.init.apply( this , arguments); } else
{ } } //支持的方法 $.fn.tabpanel.methods = { //初始化 init: function
(p_options) { tabpanelBind(p_options, this ); }, add: function
(p_options) { addTab(p_options, this ); tabpanelBind(p_options, this ); // debugger } } function
add(p_options) { var
_defaults = { id: "" } <br> //内部实现略.........<br> return _index; } <br>})(jQuery);<br><br>调用 $( "#team" ).tabpanel( ‘add‘ , "" ); |
标签:style blog class code java tar
原文地址:http://www.cnblogs.com/shanhe/p/3718875.html