Question

我正在网站上工作，目前已设置UserControl以显示导航

<div class="navigation">
        <ul>
            <li><asp:HyperLink runat="server" ID="home" Text="Home" NavigateUrl="/Default.aspx" /></li>
            <li><asp:HyperLink runat="server" ID="about" Text="About Us" NavigateUrl="/AboutUs.aspx" /></li>
            <li><asp:HyperLink runat="server" ID="experience" Text="Experience" NavigateUrl="/Experience.aspx" /></li>
            <li><asp:HyperLink runat="server" ID="capabilities" Text="Capabilities" NavigateUrl="/Capabilities.aspx" /></li>
            <li><asp:HyperLink runat="server" ID="benefits" Text="Benefits" NavigateUrl="/Benefits.aspx" /></li>
            <li><asp:HyperLink runat="server" ID="contact" Text="Contact Us" NavigateUrl="/ContactUs.aspx" /></li>
        </ul>
    </div>

我有两个页面调用UserControl。 Default.aspx以及Secondary.Master。我需要知道能够在父<li>标记或链接本身上添加“CssClass =”Active“的最佳方法。

Answer 1

考虑使用内置ASP：菜单控件。它具有内置功能，可以处理您要执行的操作。

Answer 2

您是否正在使用站点地图文件作为此选项？如果这样做，您可以利用一些内置的提供程序/控件来帮助简化操作。还有内置功能来确定导航元素是否是当前页面。

Scott Mitchell has some good tutorials关于如何利用这些功能。

Answer 3

我在UserControl上的代码中添加了一些代码

protected void Page_Load(object sender, EventArgs e)
    {
        SetActiveNavLink();
    }

    private void SetActiveNavLink()
    {
        if (HttpContext.Current.CurrentHandler.ToString().ToLower().Contains("default"))
        {
            home.Attributes.Add("class", "active");
        }
        if (HttpContext.Current.CurrentHandler.ToString().ToLower().Contains("about"))
        {
            about.Attributes.Add("class", "active");
        }
        if (HttpContext.Current.CurrentHandler.ToString().ToLower().Contains("experience"))
        {
            experience.Attributes.Add("class", "active");
        }
        if (HttpContext.Current.CurrentHandler.ToString().ToLower().Contains("capabilities"))
        {
            capabilities.Attributes.Add("class", "active");
        }
        if (HttpContext.Current.CurrentHandler.ToString().ToLower().Contains("benefits"))
        {
            benefits.Attributes.Add("class", "active");
        }
    }

像魅力一样。

在ASP.NET中选择Active Nav

3 个答案: