Bootstrap JavaScript 或弹出框未能正常工作

6

我的Bootstrap出了问题。似乎JS不正确地工作了,因为即使是最简单的popover示例也无法正常工作。(http://jsfiddle.net/weuWk/363/) 在我的源代码中使用这个小代码片段只会创建一个没有悬停功能的按钮。

Modal-Plugin实际上是起作用的,所以这应该意味着我以正确的方式包含了JS文件。无论如何,我将它复制一遍:

 <script src="js/bootstrap.min.js"></script>
 <script src="http://code.jquery.com/jquery-latest.js"></script>

1
检查控制台是否有错误,我敢打赌肯定有一个。 - Scott Selby
你在控制台看到任何错误了吗? - Mike Robinson
你知道Mike说的是什么吗?你的控制台有任何错误吗?你知道控制台是什么吗? - Chanckjh
哟,我刚刚发现如何查看JavaScript的控制台。 - user1911283
1个回答

15

在引入Bootstrap的javascript之前,必须先引入jQuery,因为Bootstrap只是jQuery的“插件”。

应按照以下顺序引入:

  1. jQuery
  2. Bootstrap
  3. 您的Javascript

编辑:请在闭合body标签之前尝试此操作

<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="js/bootstrap.min.js"></script>
<script> 
$(function(){
    $('#test').popover();​
});
 </script>

另外,控制台是你的好朋友。检查并确保没有错误。

已解决:

解决方案:包含文件的正确顺序 > 修复我从js控制台得到的错误。


如果出现这个问题 - 控制台会显示错误 "$" not defined in bootstrap.min.js。 - Scott Selby
我已经更改了这两个包含文件的顺序,但仍然无法工作。 - user1911283
此外,他提到了模型的工作原理,但没有提及弹出框。可能模型可以按照他所包含的方向工作,因为由用户操作生成的模型会在jquery定义"$"变量之后发生,而bootstrap弹出框事件则在DOM加载时尝试发生。 - Applehat
@user1911283 - 你在哪里包含bootstrap和jquery(是在头部还是在闭合的</body>标签之前?),以及你在哪里调用$('#test').popover();?请查看我答案中的更新。 - Applehat
@user1911283 - 我发现你编辑了我的答案并表示问题已解决。是否可以请你标记我的答案为正确,以便未来的读者可以找到它并受益?谢谢! - Applehat

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接