例如,在 StackOverflow 中,您可以在顶部菜单中设置以下选项:问题、标签、用户、徽章、未回答和提问.当您位于其中一个部分时,它会以橙色突出显示.
For example, here in StackOverflow you can se a top menu with the options: Questions, Tags, Users, Badges, Unanswered and Ask Question. When you are in one of those sections, it is highlighted in orange.
在 ASP.NET MVC 中实现这一目标的最佳方法是什么?
What is the best way to achieve that in ASP.NET MVC?
到目前为止,作为概念证明,我已经完成了这个助手:
So far, and as proof of concept, I have done this helper:
public static String IsCurrentUrl(this UrlHelper url, String generatedUrl, String output)
{
var requestedUrl = url.RequestContext.HttpContext.Request.Url;
if (generatedUrl.EndsWith("/") && !requestedUrl.AbsolutePath.EndsWith("/"))
generatedUrl=generatedUrl.Substring(0, generatedUrl.Length - 1);
if (requestedUrl.AbsolutePath.EndsWith(generatedUrl))
return output;
return String.Empty;
}
如果当前请求与该链接匹配,则该方法将输出字符串添加到元素.所以可以这样使用:
That method add the output string to the element if the current request match that link. So it can be used like this:
<li>
<a href="@Url.Action("AboutUs","Home")" @Url.IsCurrentUrl(@Url.Action("AboutUs", "Home"), "class=on")><span class="bullet">About Us</span></a>
</li>
第一个问题,我基本上调用了两次Url.Action
,首先是href"属性,然后是helper,我认为必须有更好的方法来做到这一点.第二个问题,这不是比较两个链接的最佳方法.我想我可以创建一个新的 Html.ActionLink
重载,所以我不需要调用 Url.Action
两次,但是有什么内置方法可以做到这一点?
First problem, I am basically calling twice to Url.Action
, first for the "href" attribute, and after in the helper, and I think there has to be a better way to do this. Second problem, that is not the best way to compare two links. I think I could create a new Html.ActionLink
overload so I don't need to call the Url.Action
twice, but is there any buil-in way to do this?
奖励:如果我添加 "class="on""
,MVC 会呈现 class=""on""
.为什么?
Bonus: if I add "class="on""
, MVC renders class=""on""
. Why?
问候.
对于我正在进行的一个项目,我们遇到了完全相同的问题.如何突出显示当前选项卡?这是当时采取的做法:
For a project that i'm working on we've had the exact same problem. How to highlight the current tab? This is the approach that was taken at the time:
在母版页视图中:
<%
var requestActionName =
ViewContext.RouteData.Values["action"].ToString();
var requestControllerName =
ViewContext.RouteData.Values["controller"].ToString();
%>
<li class="<%= requestActionName.Equals("Index",
StringComparison.OrdinalIgnoreCase)
&& requestControllerName.Equals("Home",
StringComparison.OrdinalIgnoreCase) ?
"current" : string.Empty %>">
<%: Html.ActionLink("Home", "Index", "Home") %>
</li>
基本上,我们只是将操作和控制器值与链接关联的值进行字符串比较.如果它们匹配,那么我们将其称为当前链接,并为菜单项分配一个当前"类.
Basically what's happening is that we're just string comparing the action and controller values with values associated with a link. If they match, then we're calling that the current link, and we assign a 'current' class to the menu item.
到目前为止,这是可行的,但是随着我们的规模越来越大,这个设置开始变得相当大,有很多或"这个或"那个.因此,如果您决定尝试这个,请记住这一点.
Now so far, this works, but as we've gotten bigger in size, this setup starts to get pretty large with a whole lot of 'or' this 'or' that. So keep that mind if you decide to try this.
祝你好运,希望这对你有所帮助.
Good luck, and hope this helps you out some.
这篇关于标记“当前"的最佳方式菜单中的导航项的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持跟版网!