如何用jQuery强制悬停状态？

Question

请considere这个CSS代码：

a { color: #ffcc00; } 
a:hover { color: #ccff00; } 

此HTML代码：

<a href="#" id="link">Link</a> 
<button id="btn">Click here</button> 

最后，这个JS代码：

$("#btn").click(function() { 
    $("#link").trigger("hover"); 
}); 

我想提出我的链接用途它的伪类：点击按钮时悬停。 我试图触发像mousemove，mouseenter，悬停等事件，但任何人都可以工作。 请注意，我要强制使用我的CSS伪类的：悬停规范，而不是使用这样的：

$("#link").css("color", "ccff00"); 

有些人知道我该怎么做呢？万分感谢。

Answer 1

你将不得不使用一个类，但不用担心，它非常简单。首先，我们将分配您的:hover规则，不仅适用于物理悬停的链接，还适用于类名为hovered的链接。

a:hover, a.hovered { color: #ccff00; } 

接下来，当你点击#btn，我们将切换上#link的.hovered类。

$("#btn").click(function() { 
    $("#link").toggleClass("hovered"); 
}); 

如果链接已经有类，它将被删除。如果它没有课程，它将被添加。

Answer 2

此外，您可以尝试触发鼠标悬停。

$("#btn").click(function() { 
    $("#link").trigger("mouseover"); 
}); 

不知道这是否适用于您的特定场景，但我已成功触发mouseover而不是悬停在各种情况下。