在Chrome擴展引導標籤彈出

我在HTML文件中的一些引導選項卡：在Chrome擴展引導標籤彈出

<!doctype html> 

<!-- jQuery --> 
<script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script> 

<!-- Latest compiled and minified CSS --> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 

<!-- Optional theme --> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous"> 

<!-- Latest compiled and minified JavaScript --> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> 


<style type="text/css"> 
    #mainPopup { 
     padding: 10px; 
     height: 400px; 
     width: 288px; 
     font-family: Helvetica, Ubuntu, Arial, sans-serif; 
    } 
</style> 

<html lang="en"> 

<div class="container" id="mainPopup"> 
    <ul class="nav nav-tabs"> 
     <li class="nav active"><a href="#A" data-toggle="tab">A</a></li> 
     <li class="nav"><a href="#B" data-toggle="tab">B</a></li> 
     <li class="nav"><a href="#C" data-toggle="tab">C</a></li> 
    </ul> 

    <!-- Tab panes --> 
    <div class="tab-content"> 
     <div class="tab-pane fade in active" id="A">Content inside tab A</div> 
     <div class="tab-pane fade" id="B">Content inside tab B</div> 
     <div class="tab-pane fade" id="C">Content inside tab C</div> 
    </div> 
</div> 
</html>

這裏正在顯示一個網頁，在Chrome擴展HTML：

瀏覽器中的代碼允許我更改選項卡，但Chrome瀏覽器擴展程序中的代碼不支持。這是什麼原因，以及我如何讓Bootstrap在Chrome擴展中工作？

來源

2017-02-22 db2791

事實證明，您無法鏈接HTML文件頂部的外部Javascript文件。我不得不下載Bootstrap文件並將它們保存在本地，以便將它們用於擴展。

來源

2017-02-22 17:20:52 db2791

在Chrome擴展引導標籤彈出

回答

相關問題