Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/451.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript Chrome扩展弹出窗口中的引导选项卡_Javascript_Html_Css_Twitter Bootstrap_Google Chrome - Fatal编程技术网

Javascript Chrome扩展弹出窗口中的引导选项卡

Javascript Chrome扩展弹出窗口中的引导选项卡,javascript,html,css,twitter-bootstrap,google-chrome,Javascript,Html,Css,Twitter Bootstrap,Google Chrome,我的HTML文件中有一些引导选项卡: <!doctype html> <!-- jQuery --> <script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script> <!-- Lat

我的HTML文件中有一些引导选项卡:

<!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>

#主弹出窗口{
填充:10px;
高度:400px;
宽度:288px;
字体系列:Helvetica、Ubuntu、Arial、无衬线字体;
}
选项卡A内的内容 选项卡B内的内容 选项卡C内的内容
以下是网页和Chrome扩展中显示的HTML:


浏览器中的代码允许我更改选项卡,但Chrome浏览器扩展插件中的代码不允许。原因是什么?我如何让引导程序在Chrome扩展中工作?

事实证明,您无法将外部Javascript文件链接到HTML文件的顶部。我必须下载引导文件并将其保存在本地,以便在扩展中使用。

事实证明,您无法将外部Javascript文件链接到HTML文件的顶部。我必须下载引导文件并将其保存在本地,以便在扩展中使用。

我们可以使用外部Java脚本

manifest.json
add
content\u security\u policy
key中。i、 e

"content_security_policy": "script-src 'self' https://ajax.googleapis.com https://stackpath.bootstrapcdn.com; object-src 'self';"
我们可以使用外部Java脚本

manifest.json
add
content\u security\u policy
key中。i、 e

"content_security_policy": "script-src 'self' https://ajax.googleapis.com https://stackpath.bootstrapcdn.com; object-src 'self';"