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 相关文章推荐
Google Map Api和GOOGLE Search Api整合实现代码
Jul 18 Javascript
JavaScript 计算图片加载数量的代码
Jan 01 Javascript
仿新浪微博返回顶部的jquery实现代码
Oct 01 Javascript
文字不间断滚动(上下左右)实例代码
Apr 21 Javascript
JavaScript设置首页和收藏页面的小例子
Nov 11 Javascript
jQuery中:has选择器用法实例
Dec 30 Javascript
Javascript函数的参数
Jul 16 Javascript
jquery Easyui快速开发总结
Aug 20 Javascript
JS实现日期时间动态显示的方法
Dec 07 Javascript
浅谈Angular6的服务和依赖注入
Jun 27 Javascript
vue.js实现图书管理功能
Sep 24 Javascript
Vue项目打包编译优化方案
Sep 16 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
php SQL Injection with MySQL
2011/02/27 PHP
PHP goto语句简介和使用实例
2014/03/11 PHP
java解析json方法总结
2019/05/16 PHP
Yii2.0框架模型多表关联查询示例
2019/07/18 PHP
在javaScript中关于submit和button的区别介绍
2013/10/20 Javascript
js通过八个点 拖动改变div大小的实现方法
2014/03/05 Javascript
jquery实现带缩略图的全屏图片画廊效果实例
2015/06/25 Javascript
学习JavaScript设计模式(策略模式)
2015/11/26 Javascript
JavaScript仿商城实现图片广告轮播实例代码
2016/02/06 Javascript
AngularJS整合Springmvc、Spring、Mybatis搭建开发环境
2016/02/25 Javascript
基于layer.js实现收货地址弹框选择然后返回相应的地址信息
2017/05/26 Javascript
Element-ui table中过滤条件变更表格内容的方法
2018/03/02 Javascript
详解vue-cli项目中怎么使用mock数据
2018/05/29 Javascript
vue 解决循环引用组件报错的问题
2018/09/06 Javascript
vue-cli构建vue项目的步骤详解
2019/01/27 Javascript
Python交换变量
2008/09/06 Python
Python __setattr__、 __getattr__、 __delattr__、__call__用法示例
2015/03/06 Python
如何准确判断请求是搜索引擎爬虫(蜘蛛)发出的请求
2015/10/13 Python
Python中操作符重载用法分析
2016/04/29 Python
利用python爬取软考试题之ip自动代理
2017/03/28 Python
python 上下文管理器使用方法小结
2017/10/10 Python
Numpy掩码式数组详解
2018/04/17 Python
python设置环境变量的原因和方法
2019/06/24 Python
Python日志打印里logging.getLogger源码分析详解
2021/01/17 Python
Sunglasses Shop丹麦:欧洲第一的太阳镜在线销售网站
2017/10/22 全球购物
新加坡网上花店:FlowerAdvisor新加坡
2018/10/05 全球购物
洲际酒店集团英国官网:IHG英国
2019/07/10 全球购物
主办会计岗位职责
2014/03/13 职场文书
消防安全责任书
2014/04/14 职场文书
学校学雷锋活动总结
2014/06/26 职场文书
医院合作协议书
2014/08/19 职场文书
简单的离婚协议书范本
2014/11/16 职场文书
副总经理岗位职责
2015/02/02 职场文书
装修公司工程部经理岗位职责
2015/04/09 职场文书
医院消毒隔离制度
2015/08/05 职场文书
Pytest中skip和skipif的具体使用方法
2021/06/30 Python