用jquery替換li的活動類

Question

當我點擊treeview時，其他的treeviews需要關閉，試圖分配但是解決不了，任何人都可以幫助我。

http://7revolution.com/captain/captain/empty.html

$('.sidebar-menu .treeview').on('click', function(){ 
 
      if($(this).hasClass("active")) { 
 
\t \t \t \t $('.sidebar-menu').find('.treeview .treeview-menu').removeClass('active'); 
 
\t \t \t \t $(this).find(".treeview.active").removeClass("active"); 
 
\t \t \t \t e.preventDefault(); 
 
      } 
 
      else{ 
 
\t \t \t \t $('.sidebar-menu').find('.treeview-menu').attr('display', 'block'); 
 
       }

<ul class="sidebar-menu"> 
 
         <li class="active"> 
 
          <a href="index.html"> 
 
           <i class="fa fa-dashboard"></i> <span>Dashboard</span> 
 
          </a> 
 
         </li> 
 
         <li> 
 
          <a href="pages/widgets.html"> 
 
           <i class="fa fa-th"></i> <span>Widgets</span> <small class="badge pull-right bg-green">new</small> 
 
          </a> 
 
         </li> 
 
         <li class="treeview"> 
 
          <a href="#"> 
 
           <i class="fa fa-bar-chart-o"></i> 
 
           <span>Charts</span> 
 
           <i class="fa fa-angle-left pull-right"></i> 
 
          </a> 
 
          <ul class="treeview-menu"> 
 
           <li><a href="pages/charts/morris.html"><i class="fa fa-angle-double-right"></i> Morris</a></li> 
 
           <li><a href="pages/charts/flot.html"><i class="fa fa-angle-double-right"></i> Flot</a></li> 
 
           <li><a href="pages/charts/inline.html"><i class="fa fa-angle-double-right"></i> Inline charts</a></li> 
 
          </ul> 
 
         </li> 
 
         <li class="treeview"> 
 
          <a href="#"> 
 
           <i class="fa fa-laptop"></i> 
 
           <span>UI Elements</span> 
 
           <i class="fa fa-angle-left pull-right"></i> 
 
          </a> 
 
          <ul class="treeview-menu"> 
 
           <li><a href="pages/UI/general.html"><i class="fa fa-angle-double-right"></i> General</a></li> 
 
           <li><a href="pages/UI/icons.html"><i class="fa fa-angle-double-right"></i> Icons</a></li> 
 
           <li><a href="pages/UI/buttons.html"><i class="fa fa-angle-double-right"></i> Buttons</a></li> 
 
           <li><a href="pages/UI/sliders.html"><i class="fa fa-angle-double-right"></i> Sliders</a></li> 
 
           <li><a href="pages/UI/timeline.html"><i class="fa fa-angle-double-right"></i> Timeline</a></li> 
 
          </ul> 
 
         </li> 
 
        </ul>

當我點擊樹形視圖其他樹視圖需要關閉，嘗試配發但未能解決這個問題任何人可以幫助我，請。 當我點擊treeview其他treeviews需要關閉，嘗試分配，但不能解決它可以任何人請幫助我。

Answer 1

試試這個：

的Javascript：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
<script> 
$(function(){ 
    $('.sidebar-menu .treeview').on('click', function() { 
    $('.treeview').removeClass('active'); 
    $(this).addClass('active'); 
    }); 
}); 
</script> 

CSS：

<style> 
    .sidebar-menu .treeview-menu{ display: none; } 
    .active .treeview-menu { 
     display: block; 
    } 

    .treeview-menu { 
     display: none; 
    } 
</style> 

Answer 2

這可能幫助了一點：http://jsfiddle.net/qh8vz4y4/

JS

$('.sidebar-menu .treeview').on('click', function() { 
    $(this).addClass('active'); 
    $('.treeview').not(this).removeClass('active'); 
}); 

CSS

.active .treeview-menu { 
    display: block; 
} 
.treeview-menu { 
    display: none; 
}