引导 JavaScript 不起作用 [英] Bootstrap JavaScript not working

问题描述

我的切换 javascript 按钮最初有效 - 但是我现在发现我的切换按钮包括导航栏折叠切换和手风琴面板.我已经包括了我的页眉和页脚.根据我的研究，我看不出它为什么停止工作.任何帮助将不胜感激.

标题:网站标题

 <link href="style/css/bootstrap.min.css" rel="stylesheet"><!--加载字体真棒--><link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet"><!-- 用于 HTML5 元素和媒体查询的 IE8 支持的 HTML5 shim 和 Respond.js --><!-- 警告:如果您通过 file://查看页面，Respond.js 将不起作用 --><!--[如果是 IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]-->

页脚:

 <页脚><div class="容器"><p>&copy;公司 2015</p></页脚>

<!--/容器-->

<!-- Bootstrap 核心 JavaScript==================================================--><!-- 放置在文档的末尾，以便页面加载更快--><script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script><script src="../../dist/js/bootstrap.min.js"></script><!-- 针对 Surface/桌面 Windows 8 错误的 IE10 视口破解 --><script src="../../assets/js/ie10-viewport-bug-workaround.js"></script></html>

解决方案

我猜你只是复制了引导端的内容，例如:

<script src="../../dist/js/bootstrap.min.js"></script>

如果您的根目录中的某个文件夹中有 js 引导程序文件，您可能需要确保它的路径正确.例如，如果您的 html 文件与 bootstrap.min.js 位于同一目录中，则它应该是<script src="bootstrap.min.js"></script>.

您刚刚所做的快速修复，只需将其更改为
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>

现在可能会解决问题，但它会使您的本地引导程序文件变得无用，您可以通过使用 bootstrap cdn fallback 使其变得有用.如果您无法加载远程引导程序文件，这基本上是加载您的本地引导程序文件.这是如何进行引导cdn回调

My toggle javascript buttons worked initially - however I have now found that my toggle button including navbar collapsing toggle and accordion panels. I have included my header and footer. From what I have researched I cant see why it has stopped working. Any help would be appreciated.

Header: WEBSITE TITLE

    <!-- Bootstrap -->
    <link href="style/css/bootstrap.min.css" rel="stylesheet">
    <!--load font awesome-->
    <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>

    <![endif]-->
  </head>

Footer:

 <footer>
<div class="container">
        <p>&copy; Company 2015</p>
      </footer>
    </div> <!-- /container -->
</div>
  </body>

 <!-- Bootstrap core JavaScript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
    <script src="../../dist/js/bootstrap.min.js"></script>
    <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
    <script src="../../assets/js/ie10-viewport-bug-workaround.js"></script>
  </body>
</html>

解决方案

I guess you just copied what was said on the bootstrap side for example:

<script src="../../dist/js/bootstrap.min.js"></script>

If you have the js bootstrap file in one of your folders in the root, you might want to make sure it is the path is right. For example if your html file is in the same directory as your bootstrap.min.js it should be <script src="bootstrap.min.js"></script>.

The quick fix you just did which is simply changing it to
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>

Might solve the problem now but it will render your local bootstrap file useless which you can make useful by using a bootstrap cdn fallback. Which is basically loading your local bootstap files if you fail to load remote bootstrap files. This is how to make a bootstrap cdn callback

这篇关于引导 JavaScript 不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！