jquery - 如何使用 jQuery 更改 NEXT 项目的背景？

Question

我有以下方法，但我无法使其工作。我想在鼠标悬停时删除以下 li-tag 的背景。

我的代码：

<div id="mainmenu">
  <ul>
          <li><a href="index.php?id=2"  >Das Hotel</a></li>
          <li><a href="index.php?id=3"  >Angebote</a></li>
          <li><a href="index.php?id=4"  >Reservierung</a></li>
          <li><a href="index.php?id=5"  >Kontakt</a></li>
          <li><a href="index.php?id=6"  >Anfahrt</a></li>
          <li><a href="index.php?id=7"  >Rechtliches</a></li>
          <li><a href="index.php?id=8"  >Impressum</a></li>
  </ul>
</div>

jQuery：

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

这里的小提琴：

http://jsfiddle.net/bQxJu/2/

Answer 1

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

Answer 2

http://jsfiddle.net/bQxJu/6/

JS里面有错误，所以我不得不修复它。我还添加了一个“鼠标移出”事件处理程序来放回背景。此外，您将 LI 的 BG 设置为“无”，但您的 CSS 在锚点上有背景，而不是 li。

这是JS：

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