bootstrap选项卡不能再次切换

Question

为什么这不切换？ 我试图找到代码中的错误，但我找不到任何。

<ul id="countrytabs" class="nav nav-tabs"> 
    <li class="active"> 
     <a data-toggle="tab" href="#country1">Descrizione</a> 
    </li> 
    <li> 
     <a data-toggle="tab" href="#country2">Posizione</a> 
    </li> 
    <li> 
     <a data-toggle="tab" href="#country4">Commenti</a> 
    </li> 
    <li> 
     <a data-toggle="tab" href="#country5">Calendar</a> 
    </li> 

</ul> 

<div id="mytabs"> 
    <div id="country1" class="tab-pane active"> 
     <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>  
     <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>  
     <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>  
     <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>  
     <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>  
     <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>  
     <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>  
     <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>  
     <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>  
     <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>  
     <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>  
     <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>  
     <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>  
     <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>  
     <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>  


    </div> 
    <div id="country2" class="tab-pane"> 
     <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>   

    </div> 

    <div id="country4" class="tab-pane"> 
     <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>  

    </div> 
    <div id="country5" class="tab-pane"> 
     <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>  

    </div> 
</div> 

http://www.bootply.com/pvW865e24k#

Answer 1

你必须tab-content类添加到您的div与mytabs ID。

<div id="mytabs" class="tab-content">