jQuery的$.proxy()应用示例介绍


Posted in Javascript onApril 03, 2014

今天在看<<锋利的jQuery>>时看到了proxy()的使用,感觉很模糊,就到处找资料.

jQuery的$.proxy()应用示例介绍 

jQuery的源码也没看明白.

不过总算明白了proxy的用法了;

<input type="button" value="测试" id="guoBtn" name="我是按钮的name"/>

var obj = { 
name: "我是obj的name", 
sayName: function () { 
alert(this.name); 
} 
} 
$("#guoBtn").click(obj.sayName); //我是按钮的name 
// 如果我想访问obj的name怎么办呢? 
$("#guoBtn").click($.proxy(obj.sayName,obj));//"我是obj的name" 
$("#guoBtn").click($.proxy(obj, "sayName")); //"我是obj的name"

从上面proxy(a,b)的用法可以看出他的参数有两种写法.

第一种:a是一个function函数,b是这个函数的对象所有者.

第二种:a是一个对象,b是一个字符串,是a的属性名.

还有这个实例就是<<锋利的jQuery>>上的一个例子了.

<div id="panel" style="display:none;"> 
<button>Close</button> 
</div>

$("#panel").fadeIn(function () { 
$("#panel button").click(function () { 
$(this).fadeOut(); 
}); 
});

button虽然消失了,但是panel却没有消失.可以使用proxy来解决这个问题.

$("#panel").fadeIn(function () { 
var obj = this; 
$("#panel button").click($.proxy(function () { 
$(this).fadeOut(); 
}, obj)); 
});

这样单击按钮之后,panel才会消失.

个人感觉proxy最主要就是用来修改函数执行时的上下文对象的.

是在apply的基础上做的封装,所以说proxy就是我们jQuery自己的apply.

Javascript 相关文章推荐
JavaScript 封装Ajax传递的数据代码
Jun 05 Javascript
不同浏览器对回车提交表单的处理办法
Feb 13 Javascript
使用js画图之圆、弧、扇形
Jan 12 Javascript
jQuery自适应轮播图插件Swiper用法示例
Aug 24 Javascript
原生js编写基于面向对象的分页组件
Dec 05 Javascript
jQuery中的on与bind绑定事件区别实例详解
Feb 28 Javascript
Javascript es7中比较实用的两个方法示例
Jul 21 Javascript
vue中动态添加class类名的方法
Sep 05 Javascript
微信小程序实现留言板(Storage)
Nov 02 Javascript
vue插件mescroll.js实现移动端上拉加载和下拉刷新
Mar 07 Javascript
vue项目打包后提交到git上为什么没有dist这个文件的解决方法
Sep 16 Javascript
通过JS判断网页是否为手机打开
Oct 28 Javascript
js实现的复制兼容chrome和IE
Apr 03 #Javascript
JS实现局部选择打印和局部不选择打印
Apr 03 #Javascript
javascript实现页面内关键词高亮显示代码
Apr 03 #Javascript
JavaScript控制各种浏览器全屏模式的方法、属性和事件介绍
Apr 03 #Javascript
使用jQuery动态加载js脚本文件的方法
Apr 03 #Javascript
jquery图片轮播插件仿支付宝2013版全屏图片幻灯片
Apr 03 #Javascript
JavaScript异步编程Promise模式的6个特性
Apr 03 #Javascript
You might like
PHP4实际应用经验篇(5)
2006/10/09 PHP
PHPMailer使用教程(PHPMailer发送邮件实例分析)
2012/12/06 PHP
基于PHP实现假装商品限时抢购繁忙的效果
2015/10/16 PHP
laravel 5.3中自定义加密服务的方案详解
2017/05/09 PHP
基于Laravel实现的用户动态模块开发
2017/09/21 PHP
dojo 之基础篇(二)之从服务器读取数据
2007/03/24 Javascript
JavaScript 题型问答有答案参考
2010/02/17 Javascript
De facto standard 世界上不可思议的事实标准
2010/08/29 Javascript
jQuery判断密码强度实现思路及代码
2013/04/24 Javascript
jQuery实现的原图对比窗帘效果
2014/06/15 Javascript
Node.js中使用计时器定时执行函数详解
2014/08/15 Javascript
容易造成JavaScript内存泄露几个方面
2014/09/04 Javascript
JavaScript设置表单上传时文件个数的方法
2015/08/11 Javascript
Bootstrap Chart组件使用教程
2016/04/28 Javascript
AngularJS 2.0入门权威指南
2016/10/08 Javascript
基于vue的fullpage.js单页滚动插件
2017/03/20 Javascript
Bootstrap下拉菜单更改为悬停(hover)触发的方法
2017/05/24 Javascript
protractor的安装与基本使用教程
2017/07/07 Javascript
JS加密插件CryptoJS实现的Base64加密示例
2020/08/16 Javascript
3分钟了解vue数据劫持的原理实现
2019/05/01 Javascript
手机浏览器唤起微信分享(JS)
2020/10/11 Javascript
python中stdout输出不缓存的设置方法
2014/05/29 Python
Python中Continue语句的用法的举例详解
2015/05/14 Python
Python模块搜索概念介绍及模块安装方法介绍
2015/06/03 Python
详解Python3操作Mongodb简明易懂教程
2017/05/25 Python
python matplotlib 注释文本箭头简单代码示例
2018/01/08 Python
selenium使用chrome浏览器测试(附chromedriver与chrome的对应关系表)
2018/11/29 Python
维多利亚的秘密官方旗舰店:VICTORIA’S SECRET
2018/04/02 全球购物
Windows和Linux动态库应用异同
2016/07/28 面试题
十八大感想感言
2014/02/10 职场文书
借款担保书范文
2014/05/13 职场文书
传播学专业毕业生自荐书
2014/07/01 职场文书
上班离岗检讨书
2014/09/10 职场文书
2015年迎新晚会策划书
2015/07/16 职场文书
php+laravel 扫码二维码签到功能
2021/05/15 PHP
python树莓派通过队列实现进程交互的程序分析
2021/07/04 Python