javascript - 使用引导程序将我的导航栏的链接设置为活动状态

Question

单击按钮时，我尝试将导航栏的元素设置为活动状态。

我的导航栏是这样的：

但是，例如，当我单击“a”时，“G”仍然处于活动状态。

我的代码是这样的：

<div class="navbar span8" id="navbar">
    <div class="navbar-inner">
        <ul class="nav">
             <li><a href="#a">A</a></li>
             <li><a href="#b">B</a></li>
             <li><a href="#c">C</a></li>
             <li><a href="#d">D</a></li>
             <li><a href="#e">E</a></li>
             <li><a href="#f">F</a></li>    
              .....         
       </ul>
    </div>
</div>

要设置一个类激活代码是：

 <li class="active"><a href="#f">F</a></li>

我怎么能用 jQuery 做到这一点？

Answer 1

您可以像这样将其设置为活动状态..

$('.nav li').click(function(){
    $('.nav li').removeClass('active');
    $(this).addClass('active');
})

Bootply

Answer 2

Answer 3

您可以使用以下代码：

看演示

$('.nav li').click(function(){
    $(this).addClass('active').siblings().removeClass('active');
})