Question

当较小的浏览器折叠导航栏时，我无法让导航按钮切换菜单。我已经在这个论坛上尝试了关于不同js链接的所有建议，我已经查看了按钮工作的众多bootstrap示例站点的源代码，但我仍然无法使其工作。我甚至可以在bootply中构建它，它工作正常，当我把它带到我的文件目录时，它不起作用。

此代码中是否存在明显阻止其工作的内容？

<!DOCTYPE html>
<html lang="en-US">
<head>
    <title>Snow's Farm</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-     scale=1.0, user-scalable=no">
    <meta name="description" content>
    <meta name="author" content="">
    <link href="./bootstrap.min.css" rel="stylesheet" media="screen">
    <link href="./main.css" rel="stylesheet" media="screen">
</head>

<body class="bs-docs-home" style data-twttr-rendered="true">
    <a class="sr-only" href="#content">Skip navigation</a>

    <!-- Docs master nav -->
<div class="navbar navbar-inverse navbar-fixed-top">
  <div class="container">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="#">Snow's Farm</a>
</div>
    <div class="collapse navbar-collapse">
      <ul class="nav navbar-nav">
        <li><a class="dropdown" href="www.google.com"><p>The Farm Family</p></a></li>     
        <li><a href="www.yahoo.com"><p>Mulch</p></a></li>  
        <li><a href="#soil"><p>Soil</p></a></li>
        <li><a href="#stone"><p>Stone</p></a></li>
        <li><a href="#trees"><p>Christmas Trees</p></a></li>
        <li><a href="#delivery"><p>Delivery</p></a></li>
        <li><a href="#docs"><p>Pricing Documents</p></a></li>
      </ul>
    </div><!--/.nav-collapse -->
  </div>
</div>

</body>


<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<!-- JavaScript plugins (requires jQuery) -->
<script src="http://code.jquery.com/jquery.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="./bootstrap.js"></script>
<!-- Enable responsive features in IE8 with Respond.js (https://github.com/scottjehl/Respond) -->
<script src="./respond.min.js"></script>
<script src="./jquery.js"></script>

折叠时bootstrap3导航栏切换按钮不会丢弃菜单

0 个答案: