Question

我正在尝试创建一个具有响应功能的下拉菜单，但是当我点击它们时，下拉菜单不起作用，那么这里没有打开任何代码

        <div class="navbar-header">
           <button type="button" class="navbar-toggel" data-toggel="collapse" data-target="#myNavbar">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
        <a class="navbar-brand" href="#">RG_ACADEMY</a>
        </div>
        <div class="collapse navbar-collapse" id="myNavbar">
          <ul class="nav navbar-nav">
            <li><a href="#">Home</a></li>

            <li class="dropdown">
              <a class="dropdown-toggel"  data-toggel="dropdown" href="#">About us <span class="caret"> </span> </a>
              <ul class="dropdown-menu">
                <li><a href="#">About Academy</a></li>
                <li><a href="#">Faculty Team</a></li>
              </ul>
            </li>

              <li class="dropdown">
              <a class="dropdown-toggel" data-toggel="dropdown" href="#">Courses <span class="caret"> </span> </a>
              <ul class="dropdown-menu">
                <li><a href="#">JEE MAINS+ADVANCED</a></li>
                <li><a href="#">JEE MAINS</a></li>
              </ul>
              </li>

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

  </nav>

，输出为，也是我不明白为什么是节目

的标志

Answer 1

修复你的拼写。如果拼写错误，Bootstrap无法正确定位您的类。 Bootstrap使用拼写toggle，而不是toggel -

    <div class="navbar-header">
       <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
    <a class="navbar-brand" href="#">RG_ACADEMY</a>
    </div>
    <div class="collapse navbar-collapse" id="myNavbar">
      <ul class="nav navbar-nav">
        <li><a href="#">Home</a></li>

        <li class="dropdown">
          <a class="dropdown-toggle"  data-toggle="dropdown" href="#">About us <span class="caret"> </span> </a>
          <ul class="dropdown-menu">
            <li><a href="#">About Academy</a></li>
            <li><a href="#">Faculty Team</a></li>
          </ul>
        </li>

          <li class="dropdown">
          <a class="dropdown-toggle" data-toggle="dropdown" href="#">Courses <span class="caret"> </span> </a>
          <ul class="dropdown-menu">
            <li><a href="#">JEE MAINS+ADVANCED</a></li>
            <li><a href="#">JEE MAINS</a></li>
          </ul>
          </li>

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

Answer 2

有效。您的错误是您在代码中的任何地方错误拼写toggle到toggel。纠正这一点，一切都很好。

<nav>
 <div>
<div class="navbar-header">
           <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
        <a class="navbar-brand" href="#">RG_ACADEMY</a>
        </div>
        <div class="collapse navbar-collapse" id="myNavbar">
          <ul class="nav navbar-nav">
            <li><a href="#">Home</a></li>
            <li class="dropdown">
              <a class="dropdown-toggle"  data-toggle="dropdown" href="#">About us <span class="caret"> </span> </a>
              <ul class="dropdown-menu">
                <li><a href="#">About Academy</a></li>
                <li><a href="#">Faculty Team</a></li>
              </ul>
            </li>

              <li class="dropdown">
              <a class="dropdown-toggle" data-toggle="dropdown" href="#">Courses <span class="caret"> </span> </a>
              <ul class="dropdown-menu">
                <li><a href="#">JEE MAINS+ADVANCED</a></li>
                <li><a href="#">JEE MAINS</a></li>
              </ul>
              </li>

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

  </nav>

包括bootstrap类和jquery。

<强> JSFIDDLE

Answer 3

例如，“toggel is TOGGLE”代码中存在错误。

它不会让你添加功能javascript应该自动引导catch如果你已经调用了你的JS

Example dropdown menu

Answer 4

尝试使用此代码解决您的问题

<script src="content/js/jquery.min.js"></script>
<script src="content/js/bootstrap.min.js"></script>
<script>
 $(document).ready(function () {
$('.dropdown-toggle').dropdown();
});
</script>

Answer 5

更改：dropdown-toggel至dropdown-toggle和data-toggel="dropdown"至data-toggle="dropdown"

部分更正的输出：Demo

Answer 6

在身体之前尝试：

"tile fileTile"

引导程序的下拉菜单不起作用？

6 个答案: