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 相关文章推荐
IE8 引入跨站数据获取功能说明
Jul 22 Javascript
刷新页面实现方式总结(HTML,ASP,JS)
Nov 13 Javascript
javascript this用法小结
Dec 19 Javascript
DOM 基本方法
Jul 18 Javascript
Mac地址验证的javascript代码
Nov 09 Javascript
使用AngularJS 应用访问 Android 手机的图片库
Mar 24 Javascript
javascript事件冒泡和事件捕获详解
May 26 Javascript
jQuery Form表单取值的方法
Jan 11 Javascript
jQuery插件FusionCharts绘制ScrollColumn2D图效果示例【附demo源码下载】
Mar 22 jQuery
ES6中新增的Object.assign()方法详解
Sep 22 Javascript
Element-ui自定义table表头、修改列标题样式、添加tooltip、:render-header使用
Apr 11 Javascript
使用webpack和rollup打包组件库的方法
Feb 25 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
Windows下PHP5和Apache的安装与配置
2006/09/05 PHP
理解PHP5中static和const关键字的区别
2007/03/19 PHP
smarty简单应用实例
2015/11/03 PHP
转自Jquery官方 jQuery1.1.3发布,速度提升800%,体积保持20K
2007/08/19 Javascript
IE7中javascript操作CheckBox的checked=true不打勾的解决方法
2009/12/07 Javascript
为超链接加上disabled后的故事
2010/12/10 Javascript
基于jQuery实现的Ajax 验证用户名是否存在的实现代码
2011/04/06 Javascript
Javascript中With语句用法实例
2015/05/14 Javascript
JS实现关闭当前页而不弹出提示框的方法
2016/06/22 Javascript
JS把内容动态插入到DIV的实现方法
2016/07/19 Javascript
浅析Ajax语法
2016/12/05 Javascript
js时间戳和c#时间戳互转方法(推荐)
2017/02/15 Javascript
Vue内容分发slot(全面解析)
2017/08/19 Javascript
vue.js仿hover效果的实现方法示例
2019/01/28 Javascript
JS实现canvas简单小画板功能
2020/06/23 Javascript
详解flask入门模板引擎
2018/07/18 Python
python使用pdfminer解析pdf文件的方法示例
2018/12/20 Python
关于Numpy中的行向量和列向量详解
2019/11/30 Python
利用python3 的pygame模块实现塔防游戏
2019/12/30 Python
Keras自定义IOU方式
2020/06/10 Python
Python如何爬取b站热门视频并导入Excel
2020/08/10 Python
Python实现自动装机功能案例分析
2020/10/22 Python
python 实现控制鼠标键盘
2020/11/27 Python
CSS3教程(9):设置RGB颜色
2009/04/02 HTML / CSS
宝拉珍选英国官网:Paula’s Choice英国
2019/05/29 全球购物
WEB控件可以激发服务端事件,请谈谈服务端事件是怎么发生并解释其原理?自动传回是什么?为什么要使用自动传回?
2012/02/21 面试题
应届生求职信写作技巧
2013/10/24 职场文书
银行工作检查书范文
2014/01/31 职场文书
实验室的标语
2014/06/20 职场文书
营销总经理岗位职责范本
2014/09/02 职场文书
事业单位个人查摆问题及整改措施
2014/10/28 职场文书
大三学生英语考试作弊检讨书
2015/01/01 职场文书
2019年员工晋升管理制度范本!
2019/07/08 职场文书
利用 SQL Server 过滤索引提高查询语句的性能分析
2021/07/15 SQL Server
微信小程序APP的事件绑定以及传递参数时的冒泡和捕获
2022/04/19 Javascript
台积电称即便经济低迷也没有降价的计划
2022/04/21 数码科技