jquery在鼠标悬停后等待3秒答案

【问题标题】：Jquery wait 3 seconds after mouseoverjquery在鼠标悬停后等待3秒
【发布时间】：2016-07-09 17:28:26
【问题描述】：

我有这个 jquery 代码

$(".y_e").mouseover(function(){
        $(this).children(".Photopreview").show("fast");
        $(this).mouseleave(function(){
            $(this).children(".Photopreview").hide("fast");
        })
});

还有这个html

     <div class="y_e">
       <div class="Photopreview">
         <img src="../uploads/a.jpg"/>
         <div class="Arrow_down" ></div>
      </div>
     </div>

如何在用户将鼠标悬停在 y_e 上后等待 3 秒？

【问题讨论】：

If mouse over for over 2 seconds then show else dont?的可能重复

标签： jquery

【解决方案1】：

您可以使用 setTimeout 进行等待。

$('.y_e').mouseover(function() {
  setTimeout(function() {
    // The stuff you want to do when your three seconds are over.
  }, 3000)
});

【讨论】：

那么如果我在 3000 处鼠标悬停它仍然会显示它
setTimeout 中的函数在鼠标悬停时立即“激活”，但仅在 3 秒后执行。不管你的鼠标在哪里。
这就是我寻找其他方式的原因
你可能想澄清你真正追求的是什么。
你说的我没听懂

【解决方案2】：

尝试使用匿名函数实现 setTimeout

$(".y_e").mouseover(function(){
    setTimeout(function() {
        $(this).children(".Photopreview").show("fast");
        $(this).mouseleave(function(){
            $(this).children(".Photopreview").hide("fast");
        })        
    }, 3000);
});

【讨论】：

【解决方案3】：

您可以使用“延迟”jquery 方法，如以下代码

$(".y_e").mouseover(function(){
    $(this).children(".Photopreview").stop(true,true).delay(3000).show("fast");
});
$(this).mouseleave(function(){
    $(this).children(".Photopreview").stop(true,true).hide("fast");
});

注意：不要在其他事件监听器中注册事件监听器，因为这会为同一事件类型注册多个监听器。

【讨论】：

你应该把 $(this).mousleave 改成 $(".y_e").mouseleave