Question

我创建了一个下拉菜单，可在此Fiddle

中看到

<div id="navbarContainer" class="container-fluid">
            <nav class="navbar">
                <div class="navbar-inner">
                    <ul class="nav">
                        <li class="dropdown" data-toggle="tab">
                            <a class="dropdown-toggle" data-toggle="dropdown" data-target="#" href="#">Adult
                                <i class="caret"></i>
                            </a>
                            <ul class="dropdown-menu" role="menu">
                                <li><a href="/">AL4 Participant Record</a></li>
                            </ul>
                        </li>
                        <li class="dropdown" data-toggle="tab">
                            <a class="dropdown-toggle" data-toggle="dropdown" data-target="#"  href="#">Youth
                                <i class="caret"></i>
                            </a>
                            <ul class="dropdown-menu" role="menu">
                                <li><a href="/Home/Youth">YS2</a></li>
                            </ul>
                        </li>
                        <li data-toggle="tab"><a class="course" href="/Course">Courses</a></li>
                    </ul>
                </div>
            </nav>
        </div>

当我点击青年菜单下的YS2时，我想导航到实际的网址 - 我该如何实现？

Answer 1

您需要从外部li中删除data-toggle =“tab”。

完成后，您的html应如下所示。

<li class="dropdown">
    <a class="dropdown-toggle" data-toggle="dropdown" data-target="#"  href="#">Youth
       <i class="caret"></i>
    </a>
    <ul class="dropdown-menu" role="menu">
        <li><a href="/Home/Youth">YS2</a></li>
    </ul>
</li>

Bootstrap下拉菜单链接问题

1 个答案: