jQuery Hover 事件，防止函数完全执行

Question

首先，我发现这个有点难以解释，因为英语不是我的母语。所以请原谅这里的困惑。

我编写了一个小通知函数，该函数在表单提交时触发。正常行为是:

• 用户提交表单
• 注释淡入
• 延迟 2 秒
• 注释淡出

当注释悬停时，它会通过 css-transition 展开。从逻辑上讲，它不应该淡出，直到用户通过 mouseleave 折叠它。 这就是我的问题:只要 div 悬停，如何防止执行 fadeOut 语句？

我尝试过类似的事情

if ($('#notification').hover()){
    return ;
}

但是当然，第一个语句已经执行，如下所示:

http://jsfiddle.net/6DsJb/

我还尝试了其他一些方法，例如一个单独的脚本，它正在监听 hover 事件，然后调用 $('#notification').show() ;

两者都不起作用。我知道这是一个简单的推理错误，但见鬼，我被困住了。

提前致谢。

Answer 1

在fadeIn调用setTimeout之后，使用以下函数:

• 如果通知已折叠，请将其隐藏。
• 否则，一旦失去鼠标焦点，请使用 .mouseleave 将其隐藏。

即:

$('#notification').fadeIn(500);

setTimeout(function() {
  if (notification_is_collapsed)
    $('#notification').fadeOut(500);
  else
    $('#notification').mouseleave(function() {
      $('#notification').fadeOut(500);
    });
}, 2000);