jquery - 你能执行基于元素伪类的 jQuery 函数吗？

Question

是否可以编写一个 jQuery 函数，当另一个元素具有和不具有伪类时触发？

例如，当元素 A 悬停在元素 C 的类上时，它的类应该是“aishovered”，如果不是，它应该返回到“anothovered”

当 A 没有悬停时:

<div class="a"> </div>
<div class="b"> </div>
<div class="c anothovered"> </div>

当 A 悬停时:

<div class="a"> </div>
<div class="b"> </div>
<div class="c aishovered"> </div>

悬停状态仅用作示例，寻找可与其他伪类(例如:active 和:visited)一起使用的 jQuery 解决方案。

Answer 1

要实际添加和删除类，对于 :hover，您可以通过 hover 响应 mouseenter 和 mouseleave

$(".a").hover(
    function() { $(".c").addClass("aishovered").removeClass("anothovered");},
    function() { $(".c").removeClass("aishovered").addClass("anothovered");}
);

...对于 :active，您可以处理 focus 和 blur。

但对于伪类一般，您必须坚持使用 CSS 解决方案。在您的情况下，由于元素是 sibling ，因此您可以使用 sibling combinator 来做到这一点:

.a:hover ~ .c {
  color: blue;
}

<div class="a">a</div>
<div class="b">b</div>
<div class="c">c</div>

这并不是字面意义上的添加和删除类，而是添加和删除样式。