jQuery 鼠标超时

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);
            });