Jquery选择下一个元素

Question

我有下一个菜单结构。

<li class="menu-422"><a href="item-1" title="">Item 1</a></li>
<li class="menu-444"><a href="item-2" title="">Item 2</a></li>
<li class="menu-449"><a href="item-3" title="">Item 3</a></li>
<li class="menu-452"><a href="item-4" title="">Item 4</a></li>

在此结构中，项目( a-tag)具有背景。我想要更改悬停事件中下一项的背景。如果我完成了项目2，我想改变项目3的背景。我用jQuery试过了，但我没有找到合适的代码。

jQuery("#mymenu li a").hover(function() {
  jQuery(this).next("li a").css('background', 'none');
}

我尝试了nextAll，使用完整的选择器路径，但是我不能选择下一个元素。

Answer 1

悬停时，您希望转到父li，然后使用next()转到下一个li，然后在该li内使用find('a')

$("#mymenu li a").hover(function() {
    $(this).parent().next().find("a").css('background', 'none');
});

Answer 2

不需要选择锚点，只需选择li并在其上附加hover事件即可。在鼠标悬停时，只需使用next方法获取下一个li元素并更改背景即可。我假设您没有将背景设置为锚点的背景，因为我正在更改li元素的背景。

$("#mymenu li").hover(function() {
    $(this).next().css('background', 'none');
    //If you want to change the background of anchor try this
    //$(this).next().find('a').css('background', 'none');
}