Bootstrap Navbar-collapse 在点击时未打开答案

【问题标题】：Bootstrap Navbar-collaps not opening on clickBootstrap Navbar-collapse 在点击时未打开
【发布时间】：2023-03-25 07:07:01
【问题描述】：

我正在尝试为我的 Mobile.site.master 页面使用 bootstrap Navbar-collaps 菜单，但它似乎有问题，按钮是我想要的位置，它只是单击菜单实际上并没有打开，我没有不知道为什么任何帮助都会很棒。代码贴在下面，如果您需要其他任何内容，请告诉我。

<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
        <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="#">BRAND</a>
            </div>
            <ul class="nav navbar-nav navbar-right">
                      <li>
                        <a href="#">Fixed Link</a>
                      </li>
            </ul>
            <div class="navbar-collapse collapse">

                <ul class="nav navbar-nav">
                     <li><a href="#">L1</a></li>
                    <li><a href=#">L2</a></li>
                </ul>

            </div>

        </div>

【问题讨论】：

标签： html twitter-bootstrap navigation

【解决方案1】：

您应该在菜单 div 中使用 ID <div class="collapse navbar-collapse" id="MenuID"> 并在按钮中调用它 data-target="#MenuID"

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

    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#MenuID" aria-expanded="false">
        <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="#">Brand</a>
    </div>


    <div class="collapse navbar-collapse" id="MenuID">
      <ul class="nav navbar-nav">
        <li class="active"><a href="#">L1 <span class="sr-only">(current)</span></a></li>
        <li><a href="#">L2</a></li>

      </ul>

      <ul class="nav navbar-nav navbar-right">
        <li><a href="#">Fixed Link</a></li>

      </ul>
    </div>
  </div>
</nav>

你可以在这里看到结果bootply

【讨论】：

你必须有一些文件丢失了......你必须有 jQuery.js bootstrap.js bootstrap.css
@Chiller 嘿，你能解释一下你的答案吗？lol tji lel bher bennouna
你不明白什么.. wach belemo khalini nekhchan chwia oumba3d nrouh :p

【解决方案2】：

您忘记了代码中的一个更改 href " 第二个链接

<ul class="nav navbar-nav">
                     <li><a href="#">L1</a></li>
                    <li><a href="#">L2</a></li>
                </ul>

您的代码正在运行

你可能包含了这个文件吗？

bootstrap.css
jquery library
bootstrap.js

https://jsfiddle.net/k60f4x3c/

【讨论】：

如何检查这些文件是否包含在内？

【解决方案3】：

我不得不恢复我的项目的备份，并且在使用 Github 时它删除了使下拉菜单正常工作所需的一个 JS 文件，但实际上我的代码中并没有错误，只是其中一些丢失了。

【讨论】：