javascript jQuery 1.8:不支持的伪:悬停

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/11998514/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 15:00:26  来源:igfitidea点击:

jQuery 1.8: unsupported pseudo: hover

javascriptjqueryjquery-1.8

提问by Gelin Luo

The following code raises the error unsupported pseudo: hoveron jQuery 1.8, while it works perfect on jQuery 1.7.2:

以下代码unsupported pseudo: hover在 jQuery 1.8 上引发错误,而它在 jQuery 1.7.2 上完美运行:

if(!$(this).parent().find('ul').first().is(':hover')) {
   $(this).parent().parent().removeClass('open');
}

Does anyone know what's going on?

有谁知道发生了什么?

回答by Brian

Unfortunately, while we all wish that our code were future proof, your $('foo').on( 'hover, ... function(){ //do stuff }code is deprecated in jQuery 1.8. I wish I had better news for you, but your code is broken because of a core change to jQuery 1.8. You now have to use the syntax

不幸的是,虽然我们都希望我们的代码是面向未来的,但您的$('foo').on( 'hover, ... function(){ //do stuff }代码在 jQuery 1.8 中已弃用。我希望我有更好的消息告诉您,但是您的代码由于 jQuery 1.8 的核心更改而损坏。您现在必须使用语法

$('.selector').on( 'mouseenter mouseleave', function() {
      $(this).toggleClass('hover');
   }
);

if(!$(this).parent().find('ul').first().hasClass('hover')) {
   $(this).parent().parent().removeClass('open');
}

Wish I had better news for you, but deprecation happens :/ ... jQuery 1.8 doesn't like your shortcut and they've deprecated the hoverevent handler from .on()and also the pseudo-selector :hover, so it can't be used that way any more.

希望我有更好的消息给你,但弃用发生了:/ ... jQuery 1.8 不喜欢你的快捷方式,他们已经弃用了hover来自.on()伪选择器的事件处理程序:hover,所以它不能以任何方式使用更多的。

回答by Matt

Old question, but for anyone googling:

老问题,但对于任何使用谷歌搜索的人:

A workaround for this is to go the other way round:

对此的解决方法是反过来:

$(":focus, :active").filter($(".your-element"));

$(":focus, :active").filter($(".your-element"));

…because .filter()also accepts jQuery objects, this will match any elements with the pseudos :focusand :activethat also have the class .your-element.

…因为.filter()也接受 jQuery 对象,这将匹配任何具有伪元素:focus并且:active也具有 class 的元素.your-element

In other words, if .your-elementisn't hovered or active, this selection matches no elements.

换句话说,如果.your-element没有悬停或激活,则此选择不匹配任何元素。

回答by mathheadinclouds

weird - for me, .is(":hover") is still working in 1.8, but broken in 1.9.1.

奇怪 - 对我来说, .is(":hover") 仍在 1.8 中工作,但在 1.9.1 中已损坏。

Anyway, here is a fix

无论如何,这是一个修复

function mouseIsOverWorkaround(what){
    var temp = $(what).parent().find(":hover");
    return temp.length == 1 && temp[0] == what;
}

then call above function on the "naked" (non jQuery-wrapped) element. In your case,

然后在“裸”(非 jQuery 包装)元素上调用上述函数。在你的情况下,

if(!mouseIsOverWorkaround($(this).parent().find('ul').first()[0]) {
   $(this).parent().parent().removeClass('open');
}

(don't forget the [0])

(不要忘记 [0])

the above-mentioned (comment to orig question) fiddle http://jsfiddle.net/nnnnnn/Tm77a/does not work in jQuery 1.9.1

上述(对原问题的评论)小提琴http://jsfiddle.net/nnnnnn/Tm77a/在 jQuery 1.9.1 中不起作用

fiddle with this one http://jsfiddle.net/mathheadinclouds/BxL4w/

摆弄这个http://jsfiddle.net/mathheadinclouds/BxL4w/

回答by UnLoCo

maybe you can fix this using a bit of code (but yet maybe expensive)
add class hoveron mouseenter, remove it on mouseleaveand then test on it.

也许您可以使用一些代码(但可能很昂贵)来解决这个问题,在 上
添加类,将其删除,然后对其进行测试。hovermouseentermouseleave

$('.selector').hover(
    function(){$(this).addClass('hover');},
    function(){$(this).removeClass('hover');}
);

if(!$(this).parent().find('ul').first().hasClass('hover')) {
   $(this).parent().parent().removeClass('open');
}