設置爲自舉導航類

Question

我有一個自舉導航欄，我想爲另一個li元素設置活動類，當我點擊它時。

HTML

<nav class="navbar"> 
    <div class="navbar-default" > 
    <ul class="nav navbar-nav"> 
     <li class="active"><a>Content</a></li> 
     <li><a>News</a></li> 
     <li><a>Subject</a></li> 
    </ul> 
    </div> 
</nav> 

CSS

<script type="text/javascript"> 
    $('.navbar-nav li').click(function() { 
    $('.navbar li').removeClass('active'); 
    var $this = $(this); 
    if (!$this.hasClass('active')) { 
     $this.addClass('active'); 
    } 
    }); 
</script> 

不工作，我在新的JavaScript。我想我可能會聲明類元素錯誤，jQuery不會識別我的腳本。

Answer 1

請查找附件代碼。

<nav class="navbar" style="cursor:pointer;"> 
<div class="navbar-default"> 
    <ul class="nav navbar-nav" id="navUl"> 
     <li class="active"><a>Content</a></li> 
     <li><a>News</a></li> 
     <li><a>Subject</a></li> 
    </ul> 
</div> 

和jQuery是：

$('#navUl > li').click(function() { 

    //Check for active class 
    if (!$(this).hasClass("active")) { 

     // Remove the active class 
     $("li.active").removeClass("active"); 

     // active current/clicked li 
     $(this).addClass("active"); 
    } 
}); 

我只是添加id作爲標識的jQuery，

你可以用你的課呢。

Answer 2

它與data-toggle="tab"激活一個選項卡無javascript。

<nav class="navbar"> 
    <div class="navbar-default" > 
    <ul class="nav navbar-nav"> 
     <li class="active"><a data-toggle="tab">Content</a></li> 
     <li><a data-toggle="tab">News</a></li> 
     <li><a data-toggle="tab">Subject</a></li> 
    </ul> 
    </div> 
</nav>