bootstrap tab 沒有反應怎麼辦

bootstrap tab沒有反應的解決方法：先找到bootstrap的tab切換核心程式碼；然後修改好按鈕群組和內容群組即可。

本教學操作環境：windows10系統、bootstrap3.0，本文適用於所有品牌的電腦。

推薦：《bootstrap影片教學》

使用bootstrap時踩到的一個坑(tab切換沒有出現效果)

前幾天使用bootstrap的導覽標籤頁時遇到了個問題：

  首先，第一個tab按鈕和第一個tab content部分是預設啟動狀態的。當我點擊第二個tab按鈕時就第二個tab content可以正常顯示。但是，當我再次切換回第一個tab 按鈕時，沒有效果。看了一下文檔，發現兩個

都有class = "active"。

  最後發現原來是我的文件結構沒有完全按照官方例子，按鈕容器用的是

而不是

。

  最後，梳理一下，使用bootstrap的tab切換核心程式碼如下：

 

<!-- 按钮组 -->
 <ul>
   <li class="active"><a href="#home" aria-controls="home" role="tab" data-toggle="tab">Home</a></li>
   <li><a href="#profile" data-toggle="tab">Profile</a></li>
   <li><a href="#messages" data-toggle="tab">Messages</a></li>
   <li><a href="#settings" data-toggle="tab">Settings</a></li>
 </ul>
 
<!-- 内容组 -->
 <div class="tab-content">
   <div class="tab-pane active" id="home">...</div>
   <div class="tab-pane" id="profile">...</div>
   <div class="tab-pane" id="messages">...</div>
   <div class="tab-pane" id="settings">...</div>
 </div>

以上是bootstrap tab 沒有反應怎麼辦的詳細內容。更多資訊請關注PHP中文網其他相關文章！