在说$.proxy之前,先说一下this,this是JS对像,相当于一个局部变量,只在包含它的最里面的一个function中启作用。$.proxy在各个function之间起到了桥梁作用,并且不用重新赋值this,下面2个例子,详细说一下$.proxy的用法。
1,this的作用域
$('#abc').click(function(){ //f1 console.log($(this).html()); //作用范围f1,console.log有值 $.ajax({ url: '1.php', type: "get", success:function() //f2 { console.log($(this).html()); //作用范围f2,console.log为null }//f2 }) }); //f1
第二个console.log没值的原因是,this被重新定义了。如果要使用第二个console.log有值,可以这样,也是最常用的方法:
$('#abc').click(function(){ //f1 console.log($(this).html()); //作用范围f1,console.log有值 var that=this; $.ajax({ url: '1.php', type: "get", success:function() //f2 { console.log($(that).html()); //作用范围f2,console.log有值 }//f2 }) }); //f1
2,$.proxy传值
function test(){ this.msg='this is test'; this.onclick = function(){ $('#abc').click(function(){ this.getData(); //报错,getData没有定义 }) } this.onclick1 = function(){ $('#abc').click($.proxy(this.getData,this)); //$.proxy的二个参数,第一个方法,第二个对像 } this.onclick2 = function(){ $('#abc').click($.proxy(this,"getData")); //$.proxy二个参数,第一个对像,第二个方法名 } this.getData=function(){ console.log(this.msg); } } //调用方法如下 new test().onclick(); new test().onclick1(); new test().onclick2();
onclick:报错是因为this作用域的问题,this作用域内,没有getData方法,所以报错。
onclick1和onclick2是一样的,只不过是写法不一样,传的参数不一样而已。
转载请注明
作者:海底苍鹰
地址:http://blog.51yip.com/jsjquery/1785.html