Question

我正在使用bootstrap构建一个导航栏，我的响应下拉按钮不起作用。我不知道我的代码是否有问题，或者我正在使用的源链接有问题，但是我已经用8种不同的方式重写了这段代码而我什么都没得到。我使用以下源链接来获取引导功能。非常感谢任何建议和帮助。谢谢。

<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css"/>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.0.4/js/bootstrap-dropdown.js"/>

<button type="button" class="navebar-toggle collapsed" data-toggle="dropdown" data-target=".dropdown-menu" aria-expanded="false" aria-controls="navbar">
  <li class="dropdown">activity<a href="#" class="dropdown-toggle" data-toggle="dropdown"><b class="caret"></b></a></li>
  <div class="dropdown-menu">
    <ul class="nav navbar nav" aria-labelledby="dropdown-menu">
      <li><a href="#recent activity">forum</a></li>
      <li><a href="#member forum">login</a></li>
      <li><a href="#member list">sign up</a></li>
      <li><a href="#member group">chat</a></li>   
    </ul>
  </div>
</button>

Answer 1

在添加Bootstrap js文件之前是否引用了jQuery？

更新1 ：Mate，为什么使用链接标记到js文件，它必须是脚本标记

请更改下面的代码并查看结果，我在bootstrap-dropdown.js之前添加了jQuery。

＆＃13;

<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.0.4/js/bootstrap-dropdown.js"></script>

＆＃13;

更新2：我发现您的代码存在一些问题。请尝试以下方法。

＆＃13;

<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.0.4/js/bootstrap-dropdown.js"></script>
<div class="btn-group">
  <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Activity <span class="caret"></span>
  </button>
  <ul class="dropdown-menu">
    <li><a href="#recent activity">forum</a>
    </li>
    <li><a href="#member forum">login</a>
    </li>
    <li><a href="#member list">sign up</a>
    </li>
    <li><a href="#member group">chat</a>
    </li>
  </ul>
</div>

＆＃13;

Bootstrap无法正确加载响应式导航栏

1 个答案: