引導選項卡鏈接無法正常工作

我的標籤不工作，每一件事情是罰款.Links不能正常工作,,請help.i想盡各種方法，但沒有use.I嘗試CDN，則本地文件也引導選項卡鏈接無法正常工作

<!DOCTYPE html> 
    <html lang="en"> 
    <head> 

     <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
     <meta charset="UTF-8"> 
     <title>Title</title> 
    </head> 
    <body> 
    <div class="container"> 

    <ul class="nav nav-stacked nav-justified"> 
     <li class="active"><a href="#C" data-toggle="tabs">C#</a></li> 
     <li><a href="#home" data-toggle="tabs">Home</a></li> 
     <li><a href="" data-toggle="tabs">jQuery</a></li> 
     <li><a href="" data-toggle="tabs">PHP</a></li> 
    </ul> 

     <div class="tab-content"> 
      <div class="tab-pane fade in active" id="C"> 
       <p>C# IS DEVELOPED BY MICROSOFT CORP IN 2000</p> 
      </div> 

      <div class="tab-pane fade" id="home"> 
       <p>This is HOME</p> 
      </div> 

     </div> 


    </div> 


<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> 
</body> 
</html>

來源

2016-10-02 Ahmed Abbas

您沒有包含bootstrap js文件，只有css。 –

@razethestray我連每一個文件，但仍沒有發生 –

你需要運行一些JS根據文檔以激活它們...... http://getbootstrap.com/javascript/#tabs –

您需要包括jQuery的文件運行自舉即 https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js。你不需要添加任何其他jQuery代碼。而且還數據切換將是標籤不是「標籤」。

<ul class="nav nav-tab"> 
     <li class="active"><a href="#C" data-toggle="tab">C#</a></li> 
     <li><a href="#home" data-toggle="tab">Home</a></li> 
     <li><a href="#" data-toggle="tab">jQuery</a></li> 
     <li><a href="#" data-toggle="tab">PHP</a></li> 
    </ul>

來源

2016-10-02 15:29:45

你是生活的救星 –

您需要包括引導js文件，然後也給你的菜單中選擇一個ID，並添加點擊處理程序來處理的標籤切換，就像這樣：

$('#myTab a').click(function (e) { 
 
\t e.preventDefault(); 
 
\t $(this).tab('show'); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<link href="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet"/> 
 
<script src="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script> 
 
<div class="container"> 
 
    <ul id="myTab" class="nav nav-stacked nav-justified"> 
 
    <li class="active"><a href="#C" data-toggle="tabs">C#</a></li> 
 
    <li><a href="#home" data-toggle="tabs">Home</a></li> 
 
    <li><a href="" data-toggle="tabs">jQuery</a></li> 
 
    <li><a href="" data-toggle="tabs">PHP</a></li> 
 
    </ul> 
 
    <div class="tab-content"> 
 
    <div class="tab-pane fade in active" id="C"> 
 
     <p>C# IS DEVELOPED BY MICROSOFT CORP IN 2000</p> 
 
    </div> 
 
    <div class="tab-pane fade" id="home"> 
 
     <p>This is HOME</p> 
 
    </div> 
 
    </div> 
 
</div>

來源

2016-10-02 15:17:56 DelightedD0D

引導選項卡鏈接無法正常工作

回答

相關問題