Bootstrap在Laravel Blade中无法正确显示

Question

我在公用文件夹中设置了引导文件。路线如下：

<link rel="stylesheet" href="{{url('assets/css/bootstrap.min.css')}}">
<script type="text/javascript" src="{{url('assets/js/bootstrap.min.js')}}"></script>
<script type="text/javascript" src="{{url('assets/js/jquery.min.js')}}"></script>
<script type="text/javascript" src="{{url('assets/js/tether.min.js')}}"></script>

没问题。当我检查源代码时，可以看到与文件的连接。并且引导字体也处于活动状态，但是，当我尝试从引导网站复制一些示例时。它无法正确显示。例如，我将导航栏复制到了main.blade，但它没有显示。 是什么原因造成的？有想法吗？

它是大屏幕，但显示响应式汉堡包图标？

Answer 1

您应该在引导最小js文件之前添加jQuery

<link rel="stylesheet" href="{{url('assets/css/bootstrap.min.css')}}">
<script type="text/javascript" src="{{url('assets/js/jquery.min.js')}}"></script>
<script type="text/javascript" src="{{url('assets/js/tether.min.js')}}"></script>
<script type="text/javascript" src="{{url('assets/js/bootstrap.min.js')}}"></script>

Answer 2

在HTML页面中添加javascript的顺序很重要。在这种情况下，由于bootstrap.min.js使用jquery.min.js，因此必须先添加jquery。因此，当引导程序加载并查找jquery时，它会找到它。

但是，如果一个脚本不依赖于另一个脚本，则可以按任何顺序添加它们。

因此，请先添加jquery.min.js，然后再添加所有使用jquery的内容（例如bootstrap）。