jQuery的$.proxy()应用示例介绍
更新时间:2014年04月03日 15:41:15 作者:
这篇文章主要介绍了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.
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.
相关文章
Jquery多选下拉列表插件jquery multiselect功能介绍及使用
支持点击label实现checkbox组选择,头部选项,如全选/ 取消全选 /关闭功能,支持键盘选择等等,下面与大家分享下具体使用2013-05-05
jQuery Deferred和Promise创建响应式应用程序详细介绍
接下来我们一起探索一下JavaScript中的 Deferred 和 Promise 的概念Deferred 提供了一个抽象的非阻塞的解决方案(如Ajax 请求的响应),它创建一个promise对象,其目的是在未来某个时间点返回一个响应,感兴趣的可以参考下2013-03-03
使用jquery模拟a标签的click事件无法实现跳转的解决
这篇文章主要给大家介绍了关于使用jquery模拟a标签的click事件无法实现跳转的解决方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧2018-12-12
JQUERY 获取IFrame中对象及获取其父窗口中对象示例
经常会用到iframe,难免会碰到需要在父窗口中使用iframe中的元素、或者在iframe框架中使用父窗口的元素,下面为大家简单介绍下本人的使用心得2013-08-08


最新评论