bootsrap导航栏以小尺寸宽度折叠

Question

当宽度达到＆lt; 768px它显示右下角的切换图标，但当我点击它时，它不会显示我定义的列表项。任何人都可以告诉我这个吗？赞赏。

https://jsfiddle.net/fj0u49bj/

<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
  <div class="navbar-header">
    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#main-nav">
       <span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span>
    </button> 
    <a>title</a>
  </div>
  <div class="collapse navbar-collapse" id="main-nav">
    <ul class="nav navbar-nav navbar-right">
      <li>
        <a>Link2 </a>
      </li>
      <li>
        <a>Log In</a>
        <a>Sign Up</a>
      </li>
    </ul>
  </div>
</nav>

Answer 1

我认为你缺少加载jQuery。 Bootstrap.js构建在jQuery之上，这意味着没有它就无法工作。

如果你有jQuery（在bootstrap.js之前），可能你的导航格式没有正确完成。

看看这个小提琴（下面评论中的链接），这样你就可以看到一个正确的导航栏必须如何。