1

我在 asp.net 应用程序中使用 Twitter 引导程序,下面是我的导航栏代码:

        <div class="navbar">
          <div class="navbar-inner">
            <div class="container">
                <a class="brand" href="../">MyApp</a>
                <ul class="nav">
                    <li class="active"><a href="../">Home</a></li>
                    <li><a href="../About.aspx">About us</a></li>
                    <li><a href="../ContactUs.aspx">Contact us</a></li>
                </ul>
            </div>
          </div>
        </div>

每次我在链接到菜单项的页面上时,我都想更改活动菜单项。我该怎么做呢?

4

3 回答 3

5

使用 JavaScript,您可以使用以下代码获取当前路径:

var currentPath = window.location.pathname;

并将活动类添加到当前项目,如下所示:

$(".menu a[href='" + currentPath + "']").parent().addClass("active");
于 2012-08-18T09:58:01.593 回答
2

在这里查看一个优秀的助手类:

http://chrisondotnet.com/2012/08/setting-active-link-twitter-bootstrap-navbar-aspnet-mvc/

于 2012-11-14T11:00:23.900 回答
2

@Toby Jones 确实建议了一个很好的辅助方法。但是,有些人可能只想通过控制器选择菜单项,而其他人可能希望通过控制器和动作的组合来选择菜单项。Toby 提到的文章中提到的解决方案只处理了第二种情况。

TwitterBootstrapMvc使用以下语法涵盖了这两种情况:

@using (var nav = Html.Bootstrap().Begin(new Nav().SetLinksActiveByControllerAndAction()))
{
    @nav.ActionLink("Link 1", MVC.Account.SomeAction())
    @nav.ActionLink("Link 2", "SomeOtherAction")
}

Mthod.SetLinksActiveByControllerAndAction()可以替换.SetLinksActiveByController()为适用于第一种情况的方法。

还值得一提的是,DropDowns 上提供了相同的扩展方法:

@using (var dd = Html.Bootstrap().Begin(new DropDown("Some Trigger").SetLinksActiveByController()))
{
    @dd.ActionLink("Some link", "action")
}
于 2013-07-10T20:53:38.013 回答