jquery - 如何制作 JQuery + CSS 垂直标签

Question

我的标签有问题，Jquery 没有按我预期的那样运行。

我试图创建垂直选项卡以显示不同的信息，但我的 jquery 无法正常工作。

1. 我试图隐藏除第一个之外的所有 div。
2. 然后，当单击其中一个选项卡列表时，活动类被添加到该选项卡列表中并从另一个选项卡列表中删除。
3. 最后隐藏所有 div 并显示被点击的那个。

点击查看 jsfiddle 演示

   $(document).ready(function() {
    tabContent();
})

function tabContent() {
    $('#tabsD div:not(:first)').hide(); 
    $('#tab-container li').click(function(event){
        var id = $(event.target).index();
        $('.active').removeClass('active');
        $(event.target).addClass('active');
        $('#tabsD div').hide().eq(id).show();
    });
}

Answer 1

用这个 -

var id = $(this).index('li');

演示---> http://jsfiddle.net/HjYZ6/6/

Answer 2

无需重新发明轮子：

查找左侧的选项卡和右侧的选项卡

http://twitter.github.io/bootstrap/components.html