如何在此菜单项中添加活动类?

时间:2014-02-02 17:06:08

标签: jquery css

我正在尝试将活动类添加到此子菜单项。

菜单项

<ul class="mainnav ">
  <li class="active"><a href="/Home/Index"><i class="icon-home"></i></a></li>
  <li><a href="#"><i class="icon-upload" id="upload-card"></i></a></li>
  <li>
      <a class="dropdown-toggle" data-toggle="dropdown" href="#"><i class="icon-search"></i></a>
  </li>
  <li>
      <a class="dropdown-toggle" data-toggle="dropdown" href="#"><i class="icon-plus"></i></a>                               
  </li>
</ul>

第一个li项目已添加active个类。我试图在点击当前活动菜单项时从兄弟姐妹中删除此类。

这就是我试过的 -

<script type="text/javascript">
     $(function () {
         $('ul .mainnav > li').click(function () {
             $(this).siblings().removeClass('active').addClass('active');
         });    
     });
</script>

但这不起作用。

感谢您的帮助。

1 个答案:

答案 0 :(得分:3)

试试这个

   $('.mainnav li').click(function () {
         $(this).siblings().removeClass('active')
         $(this).addClass('active');
    });

工作示例。 http://jsfiddle.net/CgSwt/