css中的活动标签

我有冗长的引导主题类结构。css中的活动标签

这是我正在设计的菜单。

Dashboard select with current '.active' class-

有在bootstrap-

<div class="navbar navbar-fixed-top navbar-inverse"> 
      <div class="navbar-inner"> 
       <div class="container-fluid"> 
        <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"><span 
         class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span> 
        </a><a class="brand" href="#">My Menu</a> 
        <div class="nav-collapse"> 
         <ul class="nav"> 
          <li class="active"><a href="/Home/Dashboard"><i class="icon-home icon-white"></i>Dashboard</a></li> 
          <li ><a href="#" id="taskMainLink">Task</a></li> 

          <li><a href="#" id="contactMainLink">Contact</a></li> 

          <li><a href="#" id="appointmentMainLink">Appointment</a></li> 

          <li><a href="#" id="projectMainLink">Project</a></li> 

          <li><a href="#" id="salesMainLink">Sales</a></li> 

         </ul>

这个代码此菜单栏设计现在发出

我希望每个选项卡上点击鼠标和其他签应该是积极的在原始状态。默认情况下，当前活动类是仪表板。

结构我下面我每次点击任何制表

$('.navbar.navbar-fixed-top.navbar-inverse>.container-fluid>.nav-collapse>.nav').click(function(){ 
$(this).find('li').removeClass('active'); 
$(this).addClass('active'); 
});

为我要去正确的类为类？如果我在这里错了，请建议我正确的解决方案。

来源

2013-02-09 Manoj

试试这个：

$('ul.nav li a').click(function(){ 
    $(this).parent().parent().children('.active').removeClass('active'); 
    $(this.parentNode).addClass('active'); 
    return false; 
});

来源

2013-02-09 12:43:38

可以请你给出parentNode意见，如何找到父元素？ – Manoj 2013-02-10 03:44:32

'this.parentNode'是选择器，它选择父节点。 – 2013-02-10 05:09:25

这应该做的伎俩：

$('ul.nav li a').click(function(e){ 
    e.preventDefault(); 
    $(this).parent().find('li.active').removeClass('active'); 
    $(this).addClass('active'); 
});

来源

2013-02-09 12:42:21 soyuka

我认为这可能是您更轻松地使用引导buttonDropdown成分，这是否适合你。

尝试使用这些按钮，下拉菜单与buttonGroups组件，让您的按键组合在一起并应用CSS来使它看起来像你的那一刻菜单。

你不需要任何额外的JavaScript来使你的菜单工作！

来源

2013-02-09 12:43:17 Undefined

css中的活动标签

回答

相关问题