Bootstrap選項卡式窗格不起作用

我正在根據guide在Bootstrap中製作模式選項卡式窗格。這裏是fiddle和代碼：Bootstrap選項卡式窗格不起作用

$(document).on("click","#tabs a",function(event) 
{ 
    alert("!!!"); 
    event.preventDefault(); 
    $(this).tab('show'); 
})

這不作品（選項卡的內容未顯示）。我的錯誤是什麼？我是否錯誤地激活了標籤或什麼？

來源

2014-09-23 Sergey Scopin

請將HTML複製到您的StackOverflow問題中，請不要鏈接到JS Fiddle。 – cvrebert 2014-09-23 18:10:37

您沒有在標籤的href中包含散列，updated fiddle。

<ul class='nav nav-tabs' role='tablist' id='tabs'> 
    <li class='active'><a href='#forPhys' role='tab' data-toggle='tab'>For individuals</a></li> 
    <li><a href='#forOrg' role='tab' data-toggle='tab'>For organisations</a></li> 
</ul>

來源

2014-09-23 11:21:47 devools

你的回答是第一位的。 – 2014-09-23 11:31:22

你只需要在href中添加一個＃，以便它知道它正在尋找一個元素的ID。

<ul class='nav nav-tabs' role='tablist' id='tabs'> 
    <li class='active'><a href='#forPhys' role='tab' data-toggle='tab'>For individuals</a></li> 
    <li><a href='#forOrg' role='tab' data-toggle='tab'>For organisations</a></li> 
</ul>

http://jsfiddle.net/52VtD/8212/

來源

2014-09-23 11:23:39 Josh90

試試這個

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet"/> 
 
    <ul class='nav nav-tabs' role='tablist' id='tabs'> 
 
     <li class='active'><a href='#forPhys' role='tab' data-toggle='tab'>For individuals</a></li> 
 
     <li><a href='#forOrg' role='tab' data-toggle='tab'>For organisations</a></li> 
 
    </ul>

來源

2014-09-23 11:28:14

你已經忘記的href的「＃」。請參閱 <ul class='nav nav-tabs' role='tablist' id='tabs'> <li class='active'> <a href='#forPhys' role='tab' data-toggle="tab">For individuals</a> </li> <li> <a href='#forOrg' role='tab' data-toggle="tab"> For organisations</a> </li> </ul>

來源

2014-09-23 11:34:42

Bootstrap選項卡式窗格不起作用

回答

相關問題