jQuery 模拟来自同级的 css 悬停

Question

我有一个菜单，其中每个元素都具有以下结构

<li>
  <a href="#">Menu item</a>
  <span></span>
</li>

当有人将鼠标悬停在链接上时，背景颜色会发生变化，跨度也会发生同样的情况。

我想要发生的是，当有人将鼠标悬停在跨度上时，它也会模拟同级 a 标签的 css 悬停规则。

我可以使用以下方法定位 anchor 元素，我尝试使用 mouseenter 函数，但这并没有给我带来希望的效果。

$('#menu li span').mouseover(function() {

    $(this).siblings('a').mouseenter();

});

我怎样才能让它工作？

谢谢

Answer 1

为什么不将鼠标悬停在 li 上？

li:hover a { change...
li:hover span { change...