jQuery mouseout 超时

Question

之前已经处理过类似的问题，但由于使用了 bind() 函数，我相信我的问题略有不同。总之……

$('.overlay').bind("mouseenter",function(){
  $(this).fadeTo('slow', 0);
}).bind("mouseleave",function(){                
  setTimeout(function() { 
    $(this).fadeTo('slow', 1);
  }, 2000);
});

我想淡出“mouseenter”上的叠加层，但只在“mouseleave”后 2000 毫秒内淡出。

我还有一个问题：当 .overlay div 淡出时，我需要能够单击它下面的内容，即我需要 div 完全消失或向下移动 z-index 堆栈。但是，如果我尝试添加它，脚本会认为鼠标已经离开 .overlay div，因此 .overlay 会淡入。

出于同样的原因，我不能使用fadeOut() 和fadeIn()。

Answer 1

当超时触发this 将不是您所期望的。你可以像这样创建一个闭包：

            $('.overlay').bind("mouseenter",function(){
                    $(this).fadeTo('slow', 0);
                    }).bind("mouseleave",function(){
                    var $this = $(this);                               
                    setTimeout(function() { 
                            $this.fadeTo('slow', 1);
                            }, 2000);
            });