Bootstrap导航栏折叠功能无效。

3
大家好,今天我将尝试使用Twitter Bootstrap,并将默认的导航栏添加到我的页面中,只需从这里复制/粘贴即可。当我改变浏览器大小时,它会显示按钮,但当我尝试单击它时,没有任何反应,我的导航栏不会滑动。我的项目是asp.net mvc4。通过NuGet包下载Bootstrap,版本为3.0。将Bootstrap的样式和脚本添加到我的页面中。

有人遇到相同的问题吗?

导航栏代码

<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
  <!-- 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="#">
      <img src="~/Content/Images/logo.png" class="img-responsive" />
    </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 class="active"><a href="#">Main</a></li>
      <li><a href="#">Main2</a></li>
      <li><a href="#">Main3</a></li>
      <li><a href="#">Main4</a></li>
    </ul>
  </div>
  <!-- /.navbar-collapse -->
</nav>

编辑:R#在div内标记了navbar-ex1-collapse,并表示该类不存在。

你能展示一下你的导航栏代码吗? - Able Alias
2
标记似乎是正确的,请确保正确加载了boostrap.js文件。 - omma2289
@codebreaker的例子基于2.3版本,我的则基于3.0。 - BorHunter
@koala_dev 三次我都重新下载了我的标记,但是还是一样的。请尝试从官方网站下载。 - BorHunter
谢谢大家,只需将.min.js更改为普通的.js,一切都可以正常工作。 - BorHunter
显示剩余2条评论
1个回答

2
我为您创建了一个 fiddle,当改变屏幕大小时它也能很好地工作。我正在使用与您相同的代码。请查看。

是的,只需要将.min文件更改为普通的js文件,谢谢。 - BorHunter

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接