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 相关文章推荐
Z-Blog中用到的js代码
Mar 15 Javascript
EXT窗口Window及对话框MessageBox
Jan 27 Javascript
jquery.bgiframe.js在IE9下提示INVALID_CHARACTER_ERR错误
Jan 11 Javascript
jQuery中:has选择器用法实例
Dec 30 Javascript
详解JavaScript逻辑And运算符
Dec 04 Javascript
浅谈JavaScript前端开发的MVC结构与MVVM结构
Jun 03 Javascript
使用开源工具制作网页验证码的方法
Oct 17 Javascript
easyui combotree加载静态数据问题(选不上)解决方法
Dec 26 Javascript
JavaScript设计模式之代理模式详解
Jun 09 Javascript
Vue 将后台传过来的带html字段的字符串转换为 HTML
Mar 29 Javascript
Vue登录注册并保持登录状态的方法
Aug 17 Javascript
微信小程序错误this.setData报错及解决过程
Sep 18 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 无限极分类
2008/03/27 PHP
YII实现分页的方法
2014/07/09 PHP
PHP实现将多个文件压缩成zip格式并下载到本地的方法示例
2018/05/23 PHP
原生PHP实现导出csv格式Excel文件的方法示例【附源码下载】
2019/03/07 PHP
表单项的name命名为submit、reset引起的问题
2007/12/22 Javascript
js获取网页可见区域、正文以及屏幕分辨率的高度
2014/05/15 Javascript
Jquery节点遍历next与nextAll方法使用示例
2014/07/22 Javascript
js实现索引图片切换效果
2015/11/21 Javascript
JavaScript实现简单的拖动效果
2016/07/02 Javascript
AngularJS动态生成div的ID源码解析
2016/08/29 Javascript
JavaScript给每一个li节点绑定点击事件的实现方法
2016/12/01 Javascript
JS实现的样式切换功能tableCSS实例
2016/12/30 Javascript
node.js利用mongoose获取mongodb数据的格式化问题详解
2017/10/06 Javascript
jQuery图片查看插件Magnify开发详解
2017/12/25 jQuery
React Component存在的几种形式详解
2018/11/06 Javascript
详解vue路由篇(动态路由、路由嵌套)
2019/01/27 Javascript
详解vue项目打包步骤
2019/03/29 Javascript
vue elementUI table 自定义表头和行合并的实例代码
2019/05/22 Javascript
解析JS在获取当前月的最后一天遇到的坑
2019/08/30 Javascript
react-native 实现购物车滑动删除效果的示例代码
2021/01/15 Javascript
通过数据库对Django进行删除字段和删除模型的操作
2015/07/21 Python
Tornado高并发处理方法实例代码
2018/01/15 Python
Python Requests库基本用法示例
2018/08/20 Python
python面向对象入门教程之从代码复用开始(一)
2018/12/11 Python
python中的print()输出
2019/04/12 Python
详解Python匿名函数(lambda函数)
2019/04/19 Python
ubuntu 安装pyqt5和卸载pyQt5的方法
2020/03/24 Python
css3隔行变换色实现示例
2014/02/19 HTML / CSS
中海讯通笔试题
2015/09/15 面试题
高二政治教学反思
2014/02/01 职场文书
音乐教学反思
2014/02/02 职场文书
小学二年级学生评语
2014/04/21 职场文书
2015入党自荐书范文
2015/03/05 职场文书
红色经典观后感
2015/06/18 职场文书
goland 设置project gopath的操作
2021/05/06 Golang
python中的random模块和相关函数详解
2022/04/22 Python