Question

我正在尝试创建菜单导航类似于标签但有垂直按钮..当我启动页面时，第一个li类被删除，当我点击任何其他链接nothign发生时，我的内容div被显示。

第一个链接应始终在页面开始时处于活动状态。

<script type="text/javascript">
$(document).ready(function() {

    var tabContainers = $('div.pages > div');

    $('div.sidemenu ul.list a').click(function () {
        tabContainers.hide().filter(this.hash).show();

        $('div.sidemenu ul.list li').removeClass('active');
        $(this).addClass('active');

        return false;
    }).filter(':first').click();


});
</script>
<div class="sidemenu">
  <ul class="list"> 
 <li class="active"><a href="#first">Login & Password</a></li>
 <li><a href="#second">Contact Details</a></li>
 <li><a href="#third">Company & Branch Details</a></li>
 <li><a href="#forth">Address Details</a></li>
  </ul>
</div>

<div class="pages">
  <div id="first">
    CONTENT 1
  </div>
  <div id="second">
    CONTENT 2
  </div>
  <div id="third">
    CONTENT 3
  </div>
  <div id="forth">
    CONTENT 4
  </div>
</div>

不确定我在这里缺少什么..也许它只是醒来，我仍然在我的第一杯咖啡..;）

Answer 1

您要将该类添加到<a>元素，但将其从其父<li>元素中删除。

$(this).addClass('active');  // "this" is the <a> that received the event

   // This removes "active" from the <li>
$('div.sidemenu ul.list li').removeClass('active');

您似乎打算让<li>拥有该课程。所以你要这样做：

$(this).parent().addClass('active');

或者，如果你不介意我混合一点DOM API：

$(this.parentNode).addClass('active');

现在去补充！ ; O）

Answer 2

将“活动”类添加到A-Element

$(this).addClass('active');

我想你想把它添加到LI-Element，所以要么添加

$(this).parent().addClass('active');

或者您在LI-Element上注册onclick

在jquery中添加/删除类的问题

2 个答案: