Question

$("li a").filter(function () {
    return this.href == location.href.replace(/#.*/, "");
}).parent().addClass("selected");

嗨，我有一个带有一级子菜单的菜单，我正在使用上面的代码将类添加到我访问过的当前链接中。结果如下：

<ul>
    <li class="selected"><a href="link1.php">Link1</a>
        <ul>
            <li><a href="link1.php?id=aaa">SubLink1</a></li>
            <li><a href="link1.php?id=bbb">SubLink2</a></li>
        </ul>
    </li>
    <li><a href="link2.php">Link2</a>
        <ul>
            <li><a href="link2.php?id=aaa">SubLink1</a></li>
            <li><a href="link2.php?id=bbb">SubLink2</a></li>
        </ul>
    </li>
</ul>

但是，如果单击任何子菜单链接，“选定”类将消失，并添加到我单击的子菜单链接中。

即使我点击子菜单链接，有没有办法让“选定”类保留在父li上？

请帮忙。提前谢谢。

更新：到目前为止，给定的答案都没有工作，但我试图根据给定的答案弄清楚。但看起来我即将放弃:(

Answer 1

似乎工作正常。如果您删除过滤，只需在$(this)的点击处理程序中使用a - 它应该有效。

$('a').on('click',function() {
    $(this).parent().addClass("selected");
});

请参阅http://jsfiddle.net/Lovkawcz/

Answer 2

$('a').on('click',function() {
$(this).parent('li').addClass("selected");
});

Answer 3

尝试向要添加li类的selected元素添加一个类，然后在脚本中更改jQuery选择器。

<script>

$("li.first-level-menu a").filter(function () {
    return this.href == location.href.replace(/#.*/, "");
}).parent().addClass("selected");

</script>
<ul>
    <li class="first-level-menu selected"><a href="#">Link1</a>
        <ul>
            <li><a href="#">SubLink1</a></li>
            <li><a href="#">SubLink2</a></li>
        </ul>
    </li>
</ul>

修改

在任何情况下，您都必须拥有允许您识别所需元素的内容，因此您可以创建一个类，并将其用作标记，或者您必须使用已经提到的HTML结构。

另一种，也可能是最后一种方式：

<script>

$("ul.main-menu > li a").filter(function () {
    return this.href == location.href.replace(/#.*/, "");
}).parent().addClass("selected");

</script>
<ul class="main-menu">
    <li class="selected"><a href="#">Link1</a>
        <ul>
            <li><a href="#">SubLink1</a></li>
            <li><a href="#">SubLink2</a></li>
        </ul>
    </li>
</ul>

Answer 4

Marco Mercury的答案可以正常使用，但是如果你想在不改变html的情况下在jQuery中这样做，你可以尝试使用这个片段：

$('li a').not('ul > li > ul > li a').on('click',function() {
    $('.selected').removeClass('selected');
    $(this).parent().addClass("selected");
});

它将与li a匹配，并使用not排除孩子。

JsFiddle

即使你点击孩子李，如何让父李班留下来？

4 个答案: