我一直在扫描,试图找到一个合适的解决方案,为主页面中的菜单项分配"活动/当前"类.关于是否执行此客户端与服务器端,该线路在中间分开.
说实话,我是JavaScript和MVC的新手,所以我没有意见.我更愿意以"最干净"和最恰当的方式做到这一点.
我有以下jQuery代码将"活动"类分配给<li>项...唯一的问题是"索引"或默认视图菜单项将始终分配活动类,因为URL始终是子字符串其他菜单链接:
(default) index = localhost/
link 1 = localhost/home/link1
link 2 = localhost/home/link1
$(function () {
var str = location.href.toLowerCase();
$('#nav ul li a').each(function() {
if (str.indexOf(this.href.toLowerCase()) > -1) {
$(this).parent().attr("class","active"); //hightlight parent tab
}
});
Run Code Online (Sandbox Code Playgroud)
伙计们,有更好的方法吗?有人至少会帮助我获得客户端版本的防弹吗?那么"索引"或默认链接总是"活跃"?有没有办法为索引方法分配假扩展?喜欢而不仅仅是基本URL localhost/home/dashboard,它不会是每个链接的子串?
说实话,我并没有真正遵循做这个服务器端的方法,这就是为什么我试图用jQuery做客户端...任何帮助将不胜感激.
在查看Orange Tabs ASP.NET MVC演示如何处理选项卡之后,它们具有以下内容:
视图:
<ul id="menu">
<% if (Html.IsCurrentAction("Index", "Home")) { %>
<li class="active"><%= Html.ActionLink("Home", "Index", "Home")%></li>
<% } else { %>
<li><%= Html.ActionLink("Home", "Index", "Home") %></li>
<% }%>
<% if (Html.IsCurrentAction("About", "Home"))
{ %>
<li class="active"><%= Html.ActionLink("About", "About", "Home")%></li>
<% } else { %>
<li><%= Html.ActionLink("About", "About", "Home")%></li>
<% }%>
<% if (Html.IsCurrentAction("SampleTags", "Home"))
{ %>
<li class="active"><%= Html.ActionLink("Sample Tags", "SampleTags", "Home")%></li>
<% } else { %>
<li><%= Html.ActionLink("Sample Tags", "SampleTags", "Home")%></li>
<% }%>
</ul>
Run Code Online (Sandbox Code Playgroud)
和相应的助手类:
namespace …Run Code Online (Sandbox Code Playgroud)