模态不工作

Question

我正在使用 Bootstrap 3 进行个人项目，但是当我添加模式/下拉菜单等内容时，它们不起作用。我查看了代码，一切都很好，所以我假设这是文件链接的问题。

标题链接：

<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
<link href="css/carousel.css" rel="stylesheet">

页脚链接：

<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css" rel="stylesheet">

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

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-theme.min.css">

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

我还有来自 Bootstrap 网站的精确副本的模式，并且所有代码都是正确的。

我必须删除所有其他本地 CSS/JS 文件吗？

他网站的 HTML 可以在here找到。

Answer 1

据我所知，您还没有加载 jQuery-Library。如 Bootstrap 页面所示，Bootstrap 的任何 Javascript 组件都需要 jQuery，see here

确保在 Bootstrap Javascript 之前加载它，如下所示：

<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="//code.jquery.com/jquery.js"></script>
<!-- Latest compiled and minified JavaScript -->
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>

那么你应该已经准备好了。

Answer 2

查看 HTML 我可以看到它缺少 jquery 库路径。请在您的 HTML 中的任何其他 JS 文件之前将其包含在顶部

Answer 3

您的代码中没有包含 jquery，只需在 bootstrap.min.js

之前包含 jquery.js

 <!-- Core javascript and icons -->
        <link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css" rel="stylesheet">
        <!-- Latest compiled and minified CSS -->
        <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">

        <!-- Optional theme -->
        <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-theme.min.css">
        <script src="//code.jquery.com/jquery.js"></script>
        <!-- Latest compiled and minified JavaScript -->
        <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>