bootstrap通过js控制tab的切换，nav-tabs改变 tab-content区域却没有？

Question

<div class="list-group" id="lmenu">
    <a href="javascript:;" class="list-group-item active">管理</a>
    <a href="javascript:;" class="list-group-item">搜索</a>
</div>

<div>
     <ul class="nav nav-tabs" id="nav-tabs">
         <li class="active"><a href="#t-list" data-toggle="tab">管理</a></li>
         <li><a href="#t-form" data-toggle="tab">搜索</a></li>
     </ul>
     <div class="tab-content">
           <div class="tab-pane fade in active" id="t-list">AAA</div>
           <div class="tab-pane fade " id="t-form">BBB</div>
     </div>
     
</div>

$(function(){
        $("#lmenu a").on("click",function(){
            var num = $(this).index();
            $("#nav-tabs li").eq(num).tab("show");
        });
    });

nav-tabs中标签 会跟着点击而改变，但是tab-content的内容区却没有任何的改变不知道是为什么？

Answer 1

你看看你的代码，

     <div class="tab-content">
           <div class="tab-pane fade in active" id="t-list">AAA</div>
           <div class="tab-pane fade " id="t-form">BBB</div>
     </div

你的div结束标签，少了一个‘>’符号

Answer 2

$('#myTab li:eq(1) a').tab('show'); 这个有效果