怎么解决$(this)失效问题_前端技术_日志_DTOP

怎么解决$(this)失效问题

来源：本站原创发布时间：2017-09-30 15:29:29 浏览次数：次【字体：小大】

先看一个列子，下面的例子是计划点击botton元素 div元素消失

		< div   id = "panel"   style = "display:none;" >   
    <button class="close">消失button> 
 div >   
< script >   
$("#panel").fadeIn(function () { 
　　$('.close').click(function () { 
　　　　$(this).fadeOut();  
　　}); 
}); 
 
 script >   

	但执行后button没有了，div元素还在，这是什么原因呢，因为，$(this) 并不是我们想象的那个this
那么我们可以这样写：

		$( "#panel" ).fadeIn( function (){  
    $('.close').click($.proxy(HidePanel, this)); 
}); 
function  HidePanel() {  
    $(this).fadeOut(); 
} 

	

也可以这样写：

$( "#panel" ).fadeIn( function (){

    $('.close').click($.proxy(function (){

    $(this).fadeOut();

},this));

});

这里用到了$.proxy() 方法，$.proxy 方法接受一个已有的函数，并返回一个带特定上下文的新的函数。该方法通常用于向上下文指向不同对象的元素添加事件。

语法：

$( selector ).proxy( function,context )

$( selector ).proxy( context,name )

参数	描述
function	要被调用的已有的函数。
context	函数所在的对象的名称。
name	已有的函数，其上下文将被改变（应该是 context 对象的属性）。

前端技术

怎么解决$(this)失效问题

用户登录

还没有账号？