1

下面的代码将在视口的最顶部放置一个 div。

预期的行为是：

当用户将鼠标悬停在 div 上，然后向上移动鼠标直到光标移出视口时，应在控制台中记录“悬停”消息。问题是没有任何东西被记录到控制台。

当鼠标离开视口时，如何让 JQuery .hover() 将某些内容记录到控制台？

<body style="margin: 0; padding: 0;">
  <div class="foo" style="background-color: blue; width: 100px; height: 100px;">
    Test
  </div>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>

  <script>

    $(".foo").hover(function(){
        console.log("hover in");
    }, function(){
        console.log("hover out");
    });

   </script>

4

2 回答 2

8

使用mouseoverandmouseout而不是hover似乎可以解决它。

$(".foo").mouseover(function(){
    console.log("hover in");
});

$(".foo").mouseout(function(){
    console.log("hover out");
});

在这里查看它的实际应用。

请注意，如果浏览器窗口周围没有镶边，即使这也不起作用。例如，当我最大化 FF4 或将其置于全屏模式时，浏览器窗口的边缘与我的屏幕边缘齐平，因此在这种情况下光标无处可移到 div 的左侧，因此 mouseout事件永远不会触发。

于 2011-03-24T19:08:35.080 回答
3

解决方法是将 JQuery 版本从 1.5.1 更改为 1.4.4。不是一个好的解决方案，但它有效。

于 2011-03-24T19:46:04.493 回答