最佳的技术来添加所选类别列出

如果在Site.Master文件中，我们有一些像最佳的技术来添加所选类别列出

<div id="menu-container"> 
    <ul id="menu"> 
     <li> 
      <%: Html.ActionLink("Frontpage", "Index", "Home")%></li> 
     <li> 
      <%: Html.ActionLink("Content", "Index", "Content")%></li> 
     <li> 
      <%: Html.ActionLink("Winners", "Index", "Winners")%></li> 
     <li> 
      <%: Html.ActionLink("Users", "Index", "Users")%></li> 
     <li> 
      <%: Html.ActionLink("Statistics", "Index", "Statistics")%></li> 
     <li> 
      <%: Html.ActionLink("Help", "Help", "Home")%></li> 
    </ul> 
    <ul id="publish"> 
     <li> 
      <%: Html.ActionLink("Preview", "Index", "Preview")%></li> 
    </ul> 
</div>

，我们希望，在正确的class="selected"属性设置为右<li>这将是最好的方式，每个内容页？

目前我使用：

<% string url = Page.Request.Url.AbsoluteUri.ToString(); %> 
<ul id="menu"> 
    <li <% if (url.Contains("/Home")) { Response.Write("class='selected'"); } %>> 
     <%: Html.ActionLink("Frontpage", "Index", "Home")%></li> 
    <li <% if (url.Contains("/Content")) { Response.Write("class='selected'"); } %>> 
     <%: Html.ActionLink("Content", "Index", "Content")%></li> 
    <li <% if (url.Contains("/Winners")) { Response.Write("class='selected'"); } %>> 
     <%: Html.ActionLink("Winners", "Index", "Winners")%></li> 
    <li <% if (url.Contains("/Users")) { Response.Write("class='selected'"); } %>> 
     <%: Html.ActionLink("Users", "Index", "Users")%></li> 
    <li <% if (url.Contains("/Statistics")) { Response.Write("class='selected'"); } %>> 
     <%: Html.ActionLink("Statistics", "Index", "Statistics")%></li> 
    <li <% if (url.Contains("/Home/Help")) { Response.Write("class='selected'"); } %>> 
     <%: Html.ActionLink("Help", "Help", "Home")%></li> 
</ul>

，但我不认为这是最好的办法。

感谢所有帮助

来源

2010-10-27 balexandre

你冷把所有的字符串列表中的对象（匿名或键入）和环路上。

然后，你只需要一个LI代码块，但对于这么小的列表，它可能会很多。

另一种解决方案是使用jQuery客户端来设置它。向每个与您想要匹配的值相对应的LI添加一个ID或类，然后添加客户端脚本，该脚本要么获取location.url，要么添加不适用的客户端脚本，并使用存储了url的隐藏字段进行匹配。

来源

2010-10-27 19:36:47

我发现实现目标的最简单方法是在页面主体中添加一个类，以便通过母版页中的代码识别当前哪个页面是最新的。然后，在CSS，你可以做这样的事情：

#menu li { /* Styles for unselected menu items */ } 

body.home #menu li.home, 
body.content #menu li.content, 
body.winners #menu li.winners 
{ 
    /* Styles for selected menu items */ 
}

这样，你也可以很容易地添加与您正在查看哪个页面其他显示逻辑。

编辑：

您可以通过访问ASP.NET变量输出页面时检测当前的URL，因此，如果菜单在母版页定义它不应该的问题。例如：

<% var convertedUrl = Request.Url.ToString().ToLower().Replace('/', '-'); %> 
<body class="<%= convertedUrl %>"> 
    <!-- Rest of page --> 
</body>

如果您位于URL“About/Company”，这会将“about-company”类放在您的正文中。

来源

2010-10-27 19:41:13 Jacob

这是一个不错的主意，干净，简单:)谢谢你的抬头 – balexandre 2010-10-28 06:46:57

菜单是在主...所以它永远不会工作。 – balexandre 2010-10-28 15:30:48

请参阅我的更新以了解如何在母版页中执行此操作。 – Jacob 2010-10-28 17:08:58

最佳的技术来添加所选类别列出

回答

相关问题