javascript - Bootstrap 导航栏移动切换不起作用

Question

我加载了 Bootstrap css 和 js 文件并添加了以下 html 代码。两者都已成功加载 - 头部标记中的 css 和页脚下方的 js。其他功能也运行良好。

<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
  <div class="container container-header">

  <!-- Brand and toggle get grouped for better mobile display -->
  <div class="navbar-header">
    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
      <span class="sr-only">Toggle navigation</span>
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
    </button>
    <a class="navbar-brand" href="{{ url_for('public.home') }}">

      NekTime

    </a>
  </div>
  <!-- Collect the nav links, forms, and other content for toggling -->
  <div class="collapse navbar-collapse navbar-ex1-collapse">
    <ul class="nav navbar-nav">
      <li><a href="{{ url_for('public.home') }}">Home</a></li>
      <li><a href="{{ url_for('public.about') }}">About</a></li>
    </ul>
    {% if current_user and current_user.is_authenticated() %}
    <ul class="nav navbar-nav navbar-right">
        <li>
            <p class="navbar-text"><a class="navbar-link" href="{{ url_for('user.members') }}">Logged in as {{ current_user.username }}</a></p>
        </li>
        <li><a class="navbar-link" href="{{ url_for('public.logout') }}"><i class="fa fa-sign-out"></i></a></li>

    </ul>
    {% elif form %}
    <ul class="nav navbar-nav navbar-right">
      <li><a href="{{ url_for('public.register') }}">Create account</a></li>
    </ul>
    <form id="loginForm" method="POST" class="navbar-form form-inline navbar-right" action="/" role="login">
      {{ form.hidden_tag() }}
      <div class="form-group">
        {{ form.username(placeholder="Username", class_="form-control") }}
        {{ form.password(placeholder="Password", class_="form-control") }}
      </div>
      <button type="submit" class="btn btn-default">Log in</button>
    </form>
    {% endif %}
  </div><!-- /.navbar-collapse -->
  </div><!-- /.container -->
</nav>

当我缩小浏览器时，切换按钮会替换其他菜单，但我无法展开该切换按钮。我设法获得了正确的数据目标。我不知道下一步该做什么

Answer 1

我在按钮标签中添加了 collapsed 类，它起作用了。看下面的代码。

 <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-ex1-collapse">