0

类似于：如何在引导按钮下拉标题中显示所选项目

我有一个两级引导菜单。我希望在选择并导航到某个项目时，始终显示该项目所在的下拉列表。这是我的精简版代码：

<ul class="menu-system">
<li class="active">
<a href="#">Location</a>
</li>
<li class="dropdown">
    <a href="#" class="dropdown-toggle menu-item" data-toggle="dropdown"> Top level Option 1</a>
    <ul class="dropdown-menu">
        <li><a href="#"> Option 1</a></li>
        <li><a href="#"> Option 2</a></li>
        <li><a href="#"> Option 3</a></li>
        <li><a href="#"> Option 4</a></li>
    </ul>
</li>

示例：当顶级选项 1> 选项 1 页面处于活动状态时，我想显示下拉菜单。它目前所做的只是显示顶级菜单。由于它是一个引导下拉菜单，因此默认情况下会显示这是下拉菜单应该工作的正确方式。不知道我是否可以让它动态显示。无论用户是否单击它或该页面上的任何其他内容，都应始终显示此内容。

我在一个 ASP.NET 应用程序中工作。我不确定这与活动标签有关，或者我是否必须编写一些 javascript/jquery 代码来获取当前页面并显示适当的下拉菜单。

非常感谢任何帮助。

JSFiddle：jsfiddle.net/yZ8C6

4

1 回答 1

1

对，我先说我无法让它在 jsfiddle 中正常工作，因为当点击命名链接时它不会重新加载页面，我相信这应该会有所帮助

$('.dropdown-menu li a').each(function() {
    if($(location).attr('href').indexOf($(this).attr('href')) > 0) {
         $('.dropdown-menu').show();
    } 
});

所以我们在这里做的是检查每个列表项的链接href，并检查它是否包含在页面链接中。如果其中任何一个匹配，下拉菜单将设置为显示。由于引导程序使用visibility和show()使用display:block，当您停止悬停时show()应该覆盖visibility: hidden

看看你是怎么做的——你可能需要为了你自己的目的稍微修改它

http://jsfiddle.net/yZ8C6/1/

如果单击其中一个链接然后仅重新加载输出帧，则可以使小提琴工作

于 2013-08-01T06:39:02.593 回答