5

我一直在使用以下代码段在 Chrome/Safari 和 FF 中确定用户是否将鼠标悬停在锚点上。

var isURL = $("a", obj).is(":hover");

我看过关于 :hover 是 CSS 选择器的各种帖子，但我无法理解的是为什么如果 obj 中有 1 个链接，代码返回true ，但如果有 2 个或更多链接，则会引发javascript 无法识别的表达式悬停错误.

这是：悬停工作的小提琴：-http: //jsfiddle.net/2kyaJ/122/

相同但多个元素（不工作）： - http://jsfiddle.net/2kyaJ/121/

谁能给我解释一下？

顺便说一句，我已经看到了...如何检查鼠标是否在 jQuery 中的元素上？

4 年过去了，这仍然是确定用户是否悬停在某个元素上的最佳且看似唯一的方法吗？如果是的话，任何人都可以提供一个例子吗？

编辑：必须去钓鱼以获得我需要的东西，但事实证明这很简单，因为它真的很好用。

我目前在一个带有 jQ​​uery 1.9.1 的插件中使用它，我在父元素（obj）的鼠标悬停时触发动画。希望其他人在将来发现它有用。使用 .length 而不是 .size，因为 .size 从 1.8 版开始已被弃用。

        function isMouseOver() {
            if ($('a:hover', obj).length != 0) {
                return true;
            } else {
                return false;
            }                           
        }

用法：

var isURL = isMouseOver();
4

4 回答 4

5

:hover在http://api.jquery.com/上没有记录——因此我不相信它以任何特定的方式工作。问题似乎是当集合中有多个元素要迭代时，Sizzle 被这个伪选择器弄糊涂了，尽管我不能通过查看代码来真正分辨乳清。

它甚至在你的第一个例子中工作的事实似乎是一个错误：http: //jsfiddle.net/2kyaJ/122/——它不适用于 jQuery 1.9

至于如何判断一个元素是否悬停——我不确定你需要在什么情况下这样做。相反，最好在触发悬停时采取行动。mouseover您可以使用和绑定到“类似悬停”的事件mouseenter。当然，还有 CSS 伪选择器:hover。

于 2013-02-26T01:35:00.067 回答
3

试试这个小提琴http://jsfiddle.net/2rU4U/：

setInterval(function(){
    var $sample = $(".sample");

    $sample.each(function(index) {
        if($(this).is(":hover")) {
           $(this).css("background", "yellow");
        }
        else {
           $(this).css("background", "");
        }
    });  
}, 200);

正如上面评论中提到的，这尊重了一个元素集合可能被返回的事实，而不仅仅是一个元素。当然，有很多元素可能会导致相当多的开销......！

于 2013-02-26T01:31:18.337 回答
1

至于为什么它不能按你的方式工作，我想说它可能是一个错误，也可能是它没有记录。我真的不知道。

但是，这里有一个适用于 jQuery 1.7.1、1.9 和 2.0.0b1 的示例：http: //jsfiddle.net/2kyaJ/125/

基本上，.is()您可以查询所有悬停的元素，然后检查是否至少有一个匹配项（$(".sample:hover").length而不是$(".sample").is(":hover")），而不是使用。

我得到的印象是，当其中任何一个元素悬停时，您想要突出显示所有.sample元素，因此是第一个 jsfiddle。但是，如果您只想突出显示悬停的元素，您可以尝试这样的操作：http: //jsfiddle.net/2kyaJ/126/

此外，如果您只是想将某些内容绑定到悬停事件，而不是每 0.2 秒或多或少检查一次，您可以使用以下.hover()功能：http: //jsfiddle.net/2kyaJ/127/

于 2013-02-26T18:54:09.650 回答
-2

老实说，设置间隔是一个糟糕的主意......

只需设置一个悬停侦听器。

$('.sample').hover(function() {
    console.log($this) // $(this) is the currently hovered element
})

JSFiddle：http: //jsfiddle.net/jeffshaver/2kyaJ/124/

于 2013-02-26T03:08:46.157 回答