个人对JQuery Proxy()函数的理解
2016-11-22 15:11
162 查看
转载至:http://www.cnblogs.com/acles/archive/2012/11/20/2779282.html
JQuery.proxy(function,context):
使用context代替function中的context。
比如:
所以这里的this指的是$("#test").
如果这样调用:$("#test").click($.proxy(you.test,you));
此时的调用相当于:
$("#test").click(function(event){
$("#log").append( you.type + " " );
});
虽然调用事件的对象是$("#test"),但是却可以使用$.proxy把事件执行内的对象改变为you。
JQuery.proxy(context,functionname):
第一个参数是你想proxy的对象,第二个参数为要改变的函数的名字。
var obj = {
name: "John",
test: function() {
$("#log").append( this.name );
$("#test").unbind("click", obj.test);
}
};
$("#test").click( jQuery.proxy( obj, "test" ) ); 把obj作为context传入test中,而不是$("#test").
这个执行完之后,结果会是John,
如果使用下面这句
$("#test").click(obj.test);
结果会是$("#test").的name值。
这个函数和上面的那个函数的功能一样,就是使用了更加简洁的方式。
最后附上一篇stackoverflow的一个关于Porxy的一个问答的答案。问答原地址:http://stackoverflow.com/questions/4986329/understanding-proxy-in-jquery
JQuery.proxy(function,context):
使用context代替function中的context。
比如:
var you = { type: "person", test: function(event) { $("#log").append( this.type + " " ); } $("#test").click(you.test);调用这句只有相当于调用: $("#test").click(function(event){ $("#log").append( this.type + " " ); });
所以这里的this指的是$("#test").
如果这样调用:$("#test").click($.proxy(you.test,you));
此时的调用相当于:
$("#test").click(function(event){
$("#log").append( you.type + " " );
});
虽然调用事件的对象是$("#test"),但是却可以使用$.proxy把事件执行内的对象改变为you。
JQuery.proxy(context,functionname):
第一个参数是你想proxy的对象,第二个参数为要改变的函数的名字。
var obj = {
name: "John",
test: function() {
$("#log").append( this.name );
$("#test").unbind("click", obj.test);
}
};
$("#test").click( jQuery.proxy( obj, "test" ) ); 把obj作为context传入test中,而不是$("#test").
这个执行完之后,结果会是John,
如果使用下面这句
$("#test").click(obj.test);
结果会是$("#test").的name值。
这个函数和上面的那个函数的功能一样,就是使用了更加简洁的方式。
最后附上一篇stackoverflow的一个关于Porxy的一个问答的答案。问答原地址:http://stackoverflow.com/questions/4986329/understanding-proxy-in-jquery
What it ultimately does is it ensures that the value of this in a function will be the value you desire. A common example is in a setTimeout that takes place inside a click handler. Take this: $('#myElement').click(function() { // In this function, "this" is our DOM element. $(this).addClass('aNewClass'); }); The intention is simple enough. When myElement is clicked, it should get the class aNewClass. Inside the handler this represents the element that was clicked. But what if we wanted a short delay before adding the class? We might use a setTimeout to accomplish it, but the trouble is that whatever function we give to setTimeout, the value of thisinside that function will be window instead of our element. $('#myElement').click(function() { setTimeout(function() { // Problem! In this function "this" is not our element! $(this).addClass('aNewClass'); }, 1000); }); So what we can do instead, is to call $.proxy(), sending it the function and the value we want to assign to this, and it will return a function that will retain that value. $('#myElement').click(function() { // ------------------v--------give $.proxy our function, setTimeout($.proxy(function() { $(this).addClass('aNewClass'); // Now "this" is again our element }, this), 1000); // ---^--------------and tell it that we want our DOM element to be the // value of "this" in the function }); So after we gave $.proxy() the function, and the value we want for this, it returned a function that will ensure that this is properly set. How does it do it? It just returns an anonymous function that calls our function using the .apply()method, which lets it explicitly set the value of this. A simplified look at the function that is returned may look like: function() { // v--------func is the function we gave to $.proxy func.apply( ctx ); // ----------^------ ctx is the value we wanted for "this" (our DOM element) } So this anonymous function is given to setTimeout, and all it does is execute our original function with the proper this context.
相关文章推荐
- 【转】个人对JQuery Proxy()函数的理解
- 个人对JQuery Proxy()函数的理解
- 个人对JQuery Proxy()函数的理解
- 函数调用中堆栈的个人理解
- 对c语言中printf函数的个人理解
- 为什么基类的析构函数必须为虚函数的原因-个人理解
- poj 3468..(存线段树个人模板(自敲)pushdown函数还不理解)
- bool findInt32(uint32_t key, int32_t *value)函数 =>个人理解!
- 函数调用中堆栈的个人理解【转】
- [C语言] 对于scanf()函数使用%d格式说明符无法读取字符的个人理解
- GCD里面函数的个人理解
- 个人理解:关于指针数组、数组指针、函数指针、函数指针数组、函数指针数组指针
- 个人理解函数返回局部变量
- 函数对象和函数适配器的个人理解。我是一个小菜鸡
- 关于KMP算法中前缀函数(next函数)的一点个人理解
- js 中关于立即执行函数的个人理解
- 黑马程序员-浅谈个人理解,oracle procedure-存储过程、Function-函数、 package-包
- opengl 中glpushmatrix和glpopmatrix函数的个人理解
- C++学习之成员函数的访问属性与继承属性对虚表构建的影响--个人理解
- Unix/Linux fork() 函数一次调用2次返回实现原理(个人理解仅供参考)