Asp.net mvc 3 ASP.NET MVC-导航中的当前页面突出显示

我想知道在使用ASP.NET MVC 3时，如何在导航中的当前页面中添加CSS类？这是我在my_Layout.cshtml文件中的导航：

<p>@Html.ActionLink("Product Search", "Index", new { controller = "Home" }, new { @class = "current" })
                | @Html.ActionLink("Orders", "Index", new { controller = "Orders" }) 
                | @Html.ActionLink("My Account", "MyAccount", new { controller = "Account" })
                | @Html.ActionLink("Logout", "LogOff", new { controller = "Account" })</p>

@Html.ActionLink（“产品搜索”，“索引”，新{controller=“Home”}，新{@class=“current”}）
|@Html.ActionLink（“订单”，“索引”，新{controller=“Orders”}）
|@Html.ActionLink（“我的账户”，“我的账户”，新的{controller=“Account”}）
|@Html.ActionLink（“注销”、“注销”，新建{controller=“Account”}）

正如您所见，我在导航中有4个链接，第一个链接应用了CSS类“current”，我希望能够根据用户所在的页面，将此类添加/删除到导航中的不同链接中。这可能吗

干杯你能做到的

@{ 
   var currentController = ViewContext.RouteData.Values["controller"] as string ?? "Home";
   var currentAction = ViewContext.RouteData.Values["action"] as string ?? "Index";
   var currentPage = (currentController + "-" + currentAction ).ToLower();
}

@Html.ActionLink("Product Search", "Index", "Home", null,
                 new { @class = currentPage == "home-index" ? "current" : "" })
@Html.ActionLink("MyAccount", "MyAccount", "Account", null,
                  new { @class = currentPage == "account-myaccount" ? "current" : "" })

你可以这样做

@{ 
   var currentController = ViewContext.RouteData.Values["controller"] as string ?? "Home";
   var currentAction = ViewContext.RouteData.Values["action"] as string ?? "Index";
   var currentPage = (currentController + "-" + currentAction ).ToLower();
}

@Html.ActionLink("Product Search", "Index", "Home", null,
                 new { @class = currentPage == "home-index" ? "current" : "" })
@Html.ActionLink("MyAccount", "MyAccount", "Account", null,
                  new { @class = currentPage == "account-myaccount" ? "current" : "" })

只是用另一种方式@dknaack他的答案。。更多的通用性和更少的功能在代码中重复

---

只是用另一种方式@dknaack他的答案。。更多的通用性和更少的功能在代码中重复。

我使用本教程来完成这项工作，它更容易理解，并且需要2分钟

---

我使用本教程来完成这项工作，它的理解要简单得多，需要2分钟

---

我建议对此使用扩展方法。比如：

public static HtmlString NavigationLink(
    this HtmlHelper html,
    string linkText,
    string actionName,
    string controllerName)
{
    string contextAction = (string)html.ViewContext.RouteData.Values["action"];
    string contextController = (string)html.ViewContext.RouteData.Values["controller"];

    bool isCurrent =
        string.Equals(contextAction, actionName, StringComparison.CurrentCultureIgnoreCase) &&
        string.Equals(contextController, controllerName, StringComparison.CurrentCultureIgnoreCase);

    return html.ActionLink(
        linkText,
        actionName,
        controllerName,
        routeValues: null,
        htmlAttributes: isCurrent ? new { @class = "current" } : null);
}

然后，您可以在视图中使用它，方法是包括扩展的名称空间，然后只调用您的方法：

@using MyExtensionNamespace;

...

  @Html.NavigationLink("Product Search", "Index", "Home")
| @Html.NavigationLink("Orders", "Index", "Orders") 
| @Html.NavigationLink("My Account", "MyAccount", "Account")
| @Html.NavigationLink("Logout", "LogOff", "Account")

---

这样做的好处是使剃须刀更干净，并且在其他视图中易于重用。

我建议为此使用扩展方法。比如：

public static HtmlString NavigationLink(
    this HtmlHelper html,
    string linkText,
    string actionName,
    string controllerName)
{
    string contextAction = (string)html.ViewContext.RouteData.Values["action"];
    string contextController = (string)html.ViewContext.RouteData.Values["controller"];

    bool isCurrent =
        string.Equals(contextAction, actionName, StringComparison.CurrentCultureIgnoreCase) &&
        string.Equals(contextController, controllerName, StringComparison.CurrentCultureIgnoreCase);

    return html.ActionLink(
        linkText,
        actionName,
        controllerName,
        routeValues: null,
        htmlAttributes: isCurrent ? new { @class = "current" } : null);
}

然后，您可以在视图中使用它，方法是包括扩展的名称空间，然后只调用您的方法：

@using MyExtensionNamespace;

...

  @Html.NavigationLink("Product Search", "Index", "Home")
| @Html.NavigationLink("Orders", "Index", "Orders") 
| @Html.NavigationLink("My Account", "MyAccount", "Account")
| @Html.NavigationLink("Logout", "LogOff", "Account")

---

这样做的好处是使剃须刀更干净，并且在其他视图中易于重用。

在我的例子中，假设我有一个主页和一个菜单

在主页中添加

ViewBag.Active

作为占位符，如下所示：

@{
   ViewBag.Title = "Home";
   ViewBag.Active = "Home";
}

然后将其放置到您的

li

类中，作为是否激活它的条件：

 <li class="@(ViewBag.Active=="Home"? "active" : "")">
      <a href="@Url.Action("Index", "Home")"><span>@ViewBag.Title</span></a>
 </li>

在我的例子中，假设我有一个主页和一个菜单

在主页中添加

ViewBag.Active

作为占位符，如下所示：

@{
   ViewBag.Title = "Home";
   ViewBag.Active = "Home";
}

然后将其放置到您的

li

类中，作为是否激活它的条件：

 <li class="@(ViewBag.Active=="Home"? "active" : "")">
      <a href="@Url.Action("Index", "Home")"><span>@ViewBag.Title</span></a>
 </li>

很乐意帮忙！祝你今天愉快@dknaack你不是错过了最后一次吗？很高兴能帮上忙！祝你今天愉快@dknaack：你不是在最后一个动作之前错过了一个}）吗？这种方法的缺点是你必须在每个控制器动作中执行ViewBag.CurrentPage。这种方法的缺点是你必须在每个控制器动作中执行ViewBag.CurrentPage。谢谢，标记为答案，因为我觉得这是最好的方法，更清晰的视图和代码重用对于扩展名

HtmlHelper.ActionLink（）

，添加命名空间如下：

使用System.Web.Mvc.Html谢谢，标记为答案，因为我觉得这是最好的方法，更清晰的视图和代码重用对于扩展
HtmlHelper.ActionLink（）
，添加命名空间如下：
使用System.Web.Mvc.Html