使用母版页时的活动元素

Active elements when using Master pages

本文关键字:活动 元素 母版页      更新时间:2023-09-26

如果我设置一个Master page来显示类似于下面的标题

<ul class="nav nav-pills nav-main" id="mainMenu">
    <li>
        <a class="dropdown-toggle" href="default.aspx">Home</a>
    </li>
    <li>
        <a href="aboutus.aspx">About Us</a>
    </li>
</ul>

我想设置当前页面的元素活动的用户是在所以在html中,它将看起来像这样,如果默认的。Aspx是活动页面

<ul class="nav nav-pills nav-main" id="mainMenu">
    <li class="dropdown active"> <%--active--%>
        <a class="dropdown-toggle" href="default.aspx">Home</a>
    </li>
    <li>
        <a href="aboutus.aspx">About Us</a>
    </li>
</ul>

标题菜单是基于一个现有的模板,所以是所有的html与CSS样式,不包含任何asp:控件。我知道我可以通过设置属性在代码隐藏中做到这一点,但我拉出来的大多数搜索都说可能有更好的方法,或者这里有一个肮脏的解决方案。link2

做这件事的最好方法是什么?

首先你必须将所有的li标签设置为服务器控件

   <ul class="nav nav-pills nav-main" id="mainMenu">
    <li>
        <a class="dropdown-toggle" href="default.aspx" runat="server" id="lidefault">Home</a>
    </li>
    <li>
        <a href="aboutus.aspx" runat="server" id="liabout">About Us</a>
    </li>
</ul>

按照上面的方法处理所有的li标签

然后在母版页面加载

string sURL=Request.Url.ToString().ToLower();
if (sURL.Contains("/default.aspx")
 lidefault.Attributes.Add("class", "active")
else if (sURL.Contains("/about.aspx")
 liabout.Attributes.Add("class", "active")
// do like the above for the rest li tags

你可以用javascript检查。设置foreach循环检查菜单的每个链接。如果您的菜单url等于页面url,则使用. addclass()方法添加活动类。