Bootstrap 导航栏下拉菜单不会切换答案

【问题标题】：Bootstrap navbar drop-down doesn't toggleBootstrap 导航栏下拉菜单不会切换
【发布时间】：2017-06-14 10:52:16
【问题描述】：

我想在我的网站中使用引导导航栏，所以我制作了网页 header.html（下面给出了链接），它工作正常

http://upscfever.com/upsc-fever/header.html

但是，当我在主页上使用相同的代码时（下面的链接）。打开后它不会关闭。

http://upscfever.com/upsc-fever/index.html

在我的主页 - index.html 我写了下面的代码。

        <script>
            $(function () {
                $("#header").load("http://upscfever.com/upsc-fever/header.html");
               });
        </script>

<body>
<div id="header"></div>
<!-- other things-->
</body>

我得到错误：

jQuery.Deferred 异常：$(...).dropdown 不是函数 @http://upscfever.com/upsc-fever/index.html:1:15 g/https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js:2:29946 g/https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js:2:30262

【问题讨论】：

标签： javascript jquery html twitter-bootstrap

【解决方案1】：

您可能希望将 load 脚本放在 body 标记的末尾之前，以便在使用之前将 <div id="header"> 添加到 DOM 中。还要确保您没有在 index.html 文件中多次加载 bootstrap js。

【讨论】：

已完成但仍无法正常工作。 header.html 中有一个 bootstrap.js，index.html 中有一个可以吗？
嗨@pranav nerurkar，你只需要加载一个bootstrap.js，所以既然你已经在header.html中有它，你应该删除index.html中的那个。

【解决方案2】：

不妨试试

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>

<link rel="stylesheet" type="text/css" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">

看看它是否会起作用。

【讨论】：