Question

我在我的网站上使用Bootstrap 3.3.4。

我有一个菜单代码段如下：

<ul class="nav navbar-nav">
<li class="{{projects}}"><a href="/darpan/pages/project/projectList.html">Projects</a></li>
</ul>

上面的代码工作正常。当用户点击“项目”菜单时，将打开相应的网页。

现在我想在上面的菜单中添加一个子菜单。该子菜单应该打开一个链接到它的新网页。我试过的代码如下：

<ul class="nav navbar-nav">
  <li class="{{projects}}" class="dropdown">
    <a class="dropdown-toggle projects"
        data-toggle="dropdown"
        href="/darpan/pages/project/projectList.html">
      <span id="projects">Projects</span>
    </a>
    <ul class="dropdown-menu">
      <li>
        <a href="/darpan/pages/project/createNewProject.html">Add new project</a>
      </li>
    </ul>
  </li>
</ul>

现在这样做之后，我面临的问题是，当用户点击“项目”菜单时，会打开下拉菜单“添加新项目”，点击“添加新项目”后会打开相应的网页。这是完美的，根据我的要求，但与菜单'项目'相关的网页怎么样，因为它没有点击它打开。这也应该与drop-don菜单功能一起使用。

有人可以帮我这方面吗？谢谢。

Answer 1

在您的主播中添加已禁用类，并使用此css添加一个<a>

<ul class="nav navbar-nav">
  <li class="{{projects}}" class="dropdown">
    <a class="dropdown-toggle projects disabled" href="/darpan/pages/project/projectList.html">Projects</a>
    <a class="dropdown-toggle"><b class="caret"></b></a>
    <ul class="dropdown-menu">
      <li><a href="/darpan/pages/project/createNewProject.html">Add new project</a></li>
    </ul>
  </li>
</ul>

<强> CSS

.caret1 {
    position: absolute !important; top: 0; right: 0;
}

.dropdown-toggle.disabled {
    padding-right: 40px;
}

在此处找到第二个解决方案：https://stackoverflow.com/a/24581001/4119808

如何在bootstrap中为两个不同的网页制作工作主菜单和下拉菜单？

1 个答案: