0

我正在尝试a:link根据悬停的子子菜单在导航菜单中为最近的父级切换 CSS 类。我可以让它为最近的父<li>标签工作，但不是a:link我希望发生此事件的内部。

的HTML：

<ul class="menu">
  <li><a href="#">First Parent</a>
     <ul class="sub-menu">
          <li><a href="#">First Child</a></li>
          <li><a href="#">Second Child</a></li>
     </ul></li>
  <li><a href="#">Second Parent</a>
     <ul class="sub-menu">
          <li><a href="#">First Child</a></li>
          <li><a href="#">Second Child</a></li>
     </ul></li>
</ul>

因此，我编写的用于选择<li>正在工作的父级的函数是：

$("ul.sub-menu").hover(function(){
        $(this).closest("li").toggleClass("parenthovered");
});

但是我怎样才能让这个类a:link为父级切换ul.menu li？就像是：

$("ul.sub-menu").hover(function(){
        $(this).closest("li a").toggleClass("parenthovered");
});

但这当然行不通，我只是不确定我需要更改什么语法。

非常感谢。

4

4 回答 4

2

您可以随时使用：

    $("ul.sub-menu").hover(function(){
            $("a", $(this).closest("li")).toggleClass("parenthovered");
    });
于 2012-04-23T15:45:26.780 回答
2 
$("ul.sub-menu").hover(function(){
    $(this).siblings('a').toggleClass("parenthovered");
});

演示

于 2012-04-23T15:45:41.693 回答
1

您可以简单地find嵌套<a>在<li>您已经拥有的内部。

$("ul.sub-menu").hover(function() {
  $(this).closest("li").find("a").toggleClass("parenthovered");
});
于 2012-04-23T15:45:48.853 回答
1

使用 find 方法获取标签内的 a 标签。

$("ul.sub-menu").hover(function(){
        $(this).closest("li").find("a").toggleClass("parenthovered");
});
于 2012-04-23T15:47:32.493 回答