html - 导航栏不显示子菜单

Question

如何将选项卡 UI 变成下拉菜单？我在底部固定了以下 Bootstrap 导航栏，其中有 2 个子菜单项(第 1 页和第 2 页)。但是，当我单击“一个”时，它不会显示子菜单项。 Here是页面和 View 源代码显示正在使用的样式和js。谢谢。

     <nav class="navbar navbar-inverse fixed-bottom">

        <ul class="nav navbar-nav" id="tabs">
            <li class="active"><a href="#">Home</a></li>
            <li class="dropdown"><a href="#" name="tab1" class="dropdown-toggle" type="button" data-toggle="dropdown">One</a>
                <ul class="dropdown-menu">
                    <li><a href="#">page 1</a></li>
                    <li><a href="#">page 2</a></li>
                </ul>
            </li>
            <li><a href="#" name="tab2">Two</a></li>
            <li><a href="#" name="tab3">Three</a></li>
            <li><a href="#" name="tab4">Four</a></li>

        </ul>

    </nav>

Answer 1

试试这个。

<ul class="nav navbar-nav" id="tabs">
    <li class="active"><a href="#">Home</a></li>
    <li class="dropup"><a href="#" name="tab1" class="dropdown-toggle" type="button" data-toggle="dropdown">One</a>
         <ul class="dropdown-menu">
             <li><a href="#">page 1</a></li>
             <li><a href="#">page 2</a></li>
         </ul>
    </li>
    <li><a href="#" name="tab2">Two</a></li>
    <li><a href="#" name="tab3">Three</a></li>
    <li><a href="#" name="tab4">Four</a></li>
</ul>

我添加了 class="dropdown-toggle" type="button" data-toggle="dropdown"在 <a> 上标签。