标签:
1)实例对象方法插件开发能让所有的jQuery实例对象都可以调用的方法。也就是说,只要通过$()工厂获得
的jQuery实例对象,都可以调用我们开发的方法。95%的插件都是这种类型
2)全局函数插件可以将独立的函数添加到jQuery命名空间中了。那么调用的时候就可以使用 $.函数名
称() 或者jQuery.函数名称()来调用了。可以理解为静态方法。
2. 添加全局函数
我们可以将jQuery理解为类,$是这个类的别名。开发全局函数就是开发这个类的
静态方法。如$.get() ,$.post()。添加新的全局函数,实际上就是扩展jQuery“类”本身,
给jQuery命名空间上添砖加瓦.
加入新添加的全局函数的名称是sayHello,功能是弹出一个hello的对话框.
jQuery.sayHello=function(name){ alert("你好,"+name); }
$.sayHello(‘张三‘);
jQuery.sayHello("李四");
jQuery.extend({ sayHello:function(name){ alert("你好"+name); }, sayBye:function(name){ alert("再见"+name); } } )
jQuery.wq={ sayHello:function(name){ alert("你好"+name); }, sayBye:function(name){ alert("再见"+name); } }
$.wq.sayHello("王五"); jQuery.wq.sayBye("赵六");
jQuery.fn.sayHello=function(){ alert("你好!"); } // 调用: $("div").sayHello();
jQuery.fn.extend({ sayHello:function(){ alert("Hello"); }, sayBye:function(){ alert("Bye Bye"); } });
$(“div”).sayHello() 和 $(“div”).sayBye();
jQuery.fn.extend({ sayHello:function(){ alert("Hello"); return this; }, sayBye:function(){ alert("Bye Bye"); return this; } });
jQuery.fn.sayHello=function(properties){ var defaults={ name:"张三", age:20 }; jQuery.extend(defaults,properties); alert("第一个参数:"+defaults.name+" 第二个参数"+defaults.age); return this; }
$("div").sayHello({ name:"李四", age:30 });
$("div").sayHello({ name:"王五" });
$("div").sayHello({ age:25 });
//定义A函数 function A(){ //定义B函数 var B=function(){ alert("这是B"); } return B; //将B函数返回 } var c=A();//此时C就是B函数 c();//其实就是调用B函数
var c=A(); c();
既然我们的目的是想让B在A之外执行,那我们可以将代码做如下变通:
var C; function A(){ var B=function(){ alert("这是B函数"); } C=B;//将内部函数赋值给C } //让A函数执行,A执行之后就将B赋值给了C A(); //现在执行C,实际上就是在执行B(); //弹出对话框 "这是B函数"
var C; (function(){ var B=function(){ alert("这是B函数"); } C=B;//将内部函数赋值给C })() //现在执行C,实际上就是在执行B(); //弹出对话框 "这是B函数"
(function($){ //这里就可以使用$符号了..... //将B函数添加到JQuery的实例对象函数中 $.fn.B=function(){ alert("这是B函数"); } })(jQuery);
<script> $(document).ready(function(){ $("h1").B(); }); </script>
(function($){ //插件代码 })(jQuery)
<script type="text/javascript" src="jquery-1.9.1.min.js"></script> <script type="text/javascript"> (function ($) { //默认参数 (放在插件外面,避免每次调用插件都调用一次,节省内存) var defaults = { color: ‘红色‘ }; //扩展 $.fn.extend({ //插件名称 height: function (options) { //覆盖默认参数 var opts = $.extend(defaults, options); //主函数 return this.each(function () { //激活事件 var obj = $(this); obj.click(function () { alert(opts.color); }); }); } }) })(jQuery); $(function () { $("p").height({ color: ‘black‘ }); }); </script>
标签:
原文地址:http://www.cnblogs.com/xulisha123/p/5462494.html