设置活动的导航菜单项

我正在用asp.net第一次玩bootstrap 3。我有一个基本的导航丸菜单，您只需添加到已选定的“类=‘主动’”在任何一个导航药丸，你想，像这样：设置活动的导航菜单项

<ul class="nav nav-pills"> 
    <li class="active"><a href="#">Home</a></li> 
    <li><a href="#">Profile</a></li> 
    <li><a href="#">Messages</a></li> 
</ul>

我想知道是否有一个最佳实践，用于设置哪个LI获得活动类。我有一个工作解决方案，但感觉笨重。

在标记代码，我使用的文字：

<li <%=NavHomeItem%> id="HomeItem" ><a href="Default.aspx">Home</a></li> 
<li <%=NavProfileItem%> id="ProfileItem"><a href="Profile.aspx">Profile</a></li>

在代码隐藏，我设置的字面基于被请求的页面：

public String NavHomeItem = ""; 
public String NavProfileItem = ""; 
public String NavMessagesItem = ""; 

private void SetNavigationHtml() 
{ 
    var url = Page.Request.Url.AbsolutePath; 
    switch (url.ToLower()) { 
     case "/profile.aspx": 
      NavProfileItem = "class=\"active\""; 
      break; 
     case "/messages.aspx": 
      NavMessagesItem = "class=\"active\""; 
      break; 
     default: 
      NavHomeItem = "class=\"active\""; 
      break; 
    } 
}

有没有更专业处理这个问题的方法？打开任何想法。

来源

2014-01-26 Tyrone

我在我的一个项目中做了什么 - 这是一个非常简单的解决方案，就是在每个顶层视图的页面上 - 就像您的案例中的'Home'，'Profile'一样，我只是有一个简单的JQuery片断，设置具体的药丸活跃，类似的规定：

$（ “＃HomeItem”）addClass（ “活动”）

这样，设置活动丸，做法完全是客户端-侧。

来源

2014-01-27 02:25:25

设置活动的导航菜单项

回答

相关问题