使用jquery将类添加到父li

时间:2011-04-11 21:37:23

标签: jquery

我想在点击时向li添加“活动”类。即使您单击该li的子页面,也应该存在“活动”类。

例如:

<ul class="primarynav">
    <li id="first">
        <a href="#" id="link1" class="">link1</a>
        <ul class="megamenu" id="">
            <li class="column"><h4 class="special"><a href="#">sub-link</a</h4></li>
        </ul>
    </li>
    <li id="second">link2</li>
    <li id="third"><a href="#" id="link3" class="">link3</a>
        <ul class="megamenu" id="">
            <li class="column"><h4 class="special"><a href="#">sub-link3</a></h4></li>
        </ul>
    </li>
</ul>

2 个答案:

答案 0 :(得分:3)

也许是这样的

$('.primarynav a').click(function() {
    // remove other links with 'active' class
    $('.primarynav a').removeClass('active');
    // set new 'active' link
    $(this).addClass('active');
});

答案 1 :(得分:0)

如果您想定位所有孩子,则可以使用.children()方法而不使用任何选择器。无论第一个<li>下方元素的复杂程度如何,这都应该有效。

$("#primarynav li").children().click(function() {(this.addClass("active"))};

http://api.jquery.com/children/


更新

请看下面的代码。这也是一个小提琴:http://jsfiddle.net/rRkeJ/3/
这与上面的想法基本相同,但更多地适应了我认为你想要的

$(".primarynav li").children().click(function() {
    $(".primarynav").children().removeClass("active");
    $(this).parent(".activable").addClass("active");
});