c# – ASP.net MVC – 导航并突出显示“当前”链接

当您创建一个新的MVC项目时,它将使用以下标记创建一个Site.master：

<div id="menucontainer">
    <ul id="menu">
        <li><%: Html.ActionLink("Home","Index","Home")%></li>
        <li><%: Html.ActionLink("About","About","Home")%></li>
    </ul>
</div>

我想把代码放在这里,这将突出显示当前的链接,如果我在该页面.

如果我添加另一个链接,如：

<li><%: Html.ActionLink("Products","Products")%></li>

如果我在“产品”控制器中的任何操作,我希望“产品”链接处于活动状态(使用类似.active的css类).

如果我在HomeController关于操作上,则关联链接应该处于活动状态.如果我在HomeController的Index操作上,Home链接应该处于活动状态.

在MVC中最好的方法是什么？

解决方法

退房 this blog post

它显示如何创建一个您调用的HTML扩展,而不是通常的Html.ActionLink扩展然后将class =“selected”添加到当前处于活动状态的列表项.

然后,您可以在CSS中添加所需的任何格式/突出显示

编辑

只需添加一些代码而不只是一个链接.

public static class HtmlHelpers
{

    public static MvcHtmlString MenuLink(this HtmlHelper htmlHelper,string linkText,string actionName,string controllerName
                                        )
    {

        string currentAction = htmlHelper.ViewContext.RouteData.GetrequiredString("action");
        string currentController = htmlHelper.ViewContext.RouteData.GetrequiredString("controller");

        if (actionName == currentAction && controllerName == currentController)
        {
            return htmlHelper.ActionLink(linkText,actionName,controllerName,null,new { @class = "selected" });
        }

        return htmlHelper.ActionLink(linkText,controllerName);


    }
}

现在,您需要在CSS中定义您选择的类,然后在您的视图中,在顶部添加一个using语句.

@使用ProjectNamespace.HtmlHelpers

并使用MenuLink而不是ActionLink

@ Html.MenuLink(“您的菜单项”,“操作”,“控制器”)