切換堂兄之間的「活躍」類

Question

所以我目前在我的頭中有三個無序列表。這是一個使用錨點進行導航的單頁網站。我需要一個「活動」類來在這三個無序列表之間單擊的任何錨點之間切換。我對jQuery和一般的編程還是比較新的，但是頁面的基本結構如下所述。

<div id="header"> 

<div id="brands-nav"> 

    <h3>Brands:</h3> 

    <ul class="navitems"> 
     <li><a href="#">Anchor</a></li> 
     <li><a href="#">Anchor</a></li> 
     <li><a href="#">Anchore</a></li> 
     <li><a href="#">Anchor</a></li> 
     <li><a href="#">Anchor</a></li> 
     <li><a href="#">Anchor</a></li> 
    </ul> 

</div> 

    <div id="mediums-nav"> 

    <h3>Mediums:</h3> 

    <ul class="navitems"> 
     <li><a href="#">Anchor</a></li> 
     <li><a href="#">Anchor</a></li> 
     <li><a href="#">Anchor</a></li> 
     <li><a href="#">Anchor</a></li> 
     <li><a href="#">Anchor</a></li> 
     <li><a href="#">Anchor</a></li> 
    </ul> 

</div> 

</div> 

    <div id="about-nav"> 

    <h3>About:</h3> 

    <ul class="navitems"> 
     <li><a href="#">Anchor</a></li> 
     <li><a href="#">Anchor</a></li> 
     <li><a href="#">Anchor</a></li> 
     <li><a href="#">Anchor</a></li> 
     <li><a href="#">Anchor</a></li> 
     <li><a href="#">Anchor</a></li> 
    </ul> 

</div> 

所以，我想弄清楚如何將「主動」類添加到任何那些被點擊，以及從任何表兄弟除去活性類的。

我明白這樣做的基本方式，如果所有的元件則採用像這樣同一母公司載...

$(document).ready(function(){ 

$("#mediums-nav a").click(function(){ 
    $(this).toggleClass("active"); 
    $(this).siblings("a").removeClass("active"); 
}); 

}）;

那麼我該如何去擴展它所有的堂兄弟？

Answer 1

試試這個：

var allAnchors = $('.navitems a').click(function(){ 
    allAnchors.removeClass('active'); 
    $(this).addClass('active'); 
});