引導：添加類「摺疊」到其他按鈕，當點擊一個

Question

我想添加多個可摺疊面板到導航欄。到目前爲止，當面板2打開時，我設法摺疊了面板1。但它不會將按鈕1改回摺疊狀態。當點擊按鈕2時，有什麼方法可以將類「摺疊」添加到按鈕1？

<div id="header"> 
<div class="navbar navbar-inverse navbar-fixed-top"> 
    <div class="navbar-inner"> 
    <div class="container"> 
     <button type="button" class="btn collapsed" data-toggle="collapse" data-target=".nav-collapse"> 
     <span class="icon-remove"></span> button 1 
     </button> 
     <button type="button" class="btn collapsed" data-toggle="collapse" data-target=".nav-collapse2"> 
     <span class="icon-remove"></span> button 2 
     </button> 
     <a class="brand" href="./index.html">Bootstrap</a> 
     <div class="nav-collapse collapse"> 
     <ul class="nav"> 
      <li class="active"> 
      <a href="./index.html">Home</a> 
      </li> 
      <li class=""> 
      <a href="./getting-started.html">Get started</a> 
      </li> 
      <li class=""> 
      <a href="./scaffolding.html">Scaffolding</a> 
      </li> 
      <li class=""> 
      <a href="./base-css.html">Base CSS</a> 
      </li> 
     </ul> 
     </div> 
     <div class="nav-collapse2 collapse"> 
     <ul class="nav"> 
      <li class="active"> 
      <a href="./index.html">Home</a> 
      </li> 
      <li class=""> 
      <a href="./getting-started.html">Get started</a> 
      </li> 
      <li class=""> 
      <a href="./scaffolding.html">Scaffolding</a> 
      </li> 
      <li class=""> 
      <a href="./base-css.html">Base CSS</a> 
      </li> 
     </ul> 
     </div> 
    </div> 
    </div> 
</div> 

，你可以在這裏看到演示：http://jsfiddle.net/Kierlens/3Uet8/

Answer 1

$(".btn").on("vclick", function(){ 
    $(".btn").addClass("collapsed"); 
    $(this).removeClass("collapsed"); 
    return false; 
});