вкладки Bootstrap не включается

Question

я пытаюсь использовать бутстраповские вкладки, используя следующий код

<div class="block full"> 
    <div class="block-title"> 
     <h2>Head</small></h2> 
    </div> 
    <ul class="nav nav-tabs push" data-toggle="tabs"> 
     <li class="active"><a href="#example-tabs-home">Home</a></li> 
     <li class=""><a href="#example-tabs-profile">Profile</a></li> 
     <li class=""><a href="#example-tabs-messages" data-toggle="tooltip" title="" data-original-title="Messages"><i class="icon-envelope-alt"></i></a></li> 
     <li class=""><a href="#example-tabs-settings" data-toggle="tooltip" title="" data-original-title="Settings"><i class="icon-cogs"></i></a></li> 
    </ul> 
    <div class="tab-content"> 
     <div class="tab-pane active" id="example-tabs-home">Home..</div> 
     <div class="tab-pane" id="example-tabs-profile">Profile..</div> 
     <div class="tab-pane" id="example-tabs-messages">Messages..</div> 
     <div class="tab-pane" id="example-tabs-settings">Settings..</div> 
    </div> 
</div> 

, но когда я пытаюсь использовать его. он не переключает вкладки, но добавляет содержимое вкладки в текущую ....

Примечание: у меня есть jquery, сценарии начальной загрузки.

Answer 1

Я думаю, что главная проблема была бы вы использовали data-toggle="tooltip", и вы должны были с помощью data-toggle="tab"

Это работает.

<div class="block full"> 
    <div class="block-title"> 
     <h2>Head</small></h2> 
    </div> 

    <ul class="nav nav-tabs push" role="tablist"> 
     <li class="active"><a href="#example-tabs-home" role="tab" data-toggle="tab">Home</a></li> 
     <li><a href="#example-tabs-profile" role="tab" data-toggle="tab">Profile</a></li> 
     <li><a href="#example-tabs-messages" role="tab" data-toggle="tab" data-original-title="Messages"><i class="glyphicon glyphicon-envelope"></i></a></li> 
     <li><a href="#example-tabs-settings" role="tab" data-toggle="tab" data-original-title="Settings"><i class="glyphicon glyphicon-cog"></i></a></li> 
    </ul> 


    <div class="tab-content"> 
     <div class="tab-pane active" id="example-tabs-home">Home</div> 
     <div class="tab-pane" id="example-tabs-profile">Profile</div> 
     <div class="tab-pane" id="example-tabs-messages">Messages</div> 
     <div class="tab-pane" id="example-tabs-settings">Settings</div> 
    </div> 

</div>