ASP.NET C＃随着列表导航如何设置ID =＆QUOT;本期＆QUOT;主动导航页面？ [英] ASP.NET C# With list navigation how to set id="current" on active navigation page?

问题描述

我还在学习asp.net，想知道是否有一个简单的方法来对ID =当前设置为导航栏，以便根据该页面的用户是在它会突出显示页面。我的模板设置为使用id =当前改变链接的风格，我有我的类来设置每个标签的样式。

I'm still learning asp.net and wanted to know if there was a simple way to set the id="current" to the navigation bar so that depending on the page a user was on it would highlight that page. My template is set up to use the id="current" to change the style of the link and I have i class to set the style of each tab.

下面是我的Site.Master的code

Here is the code in my Site.Master

<nav id="navigation" class="style-1">

<div class="left-corner"></div>
<div class="right-corner"></div>

<ul class="menu" id="responsive">

    <li><a href="home.aspx" id="current"><i class="home"></i> Home</a></li>

    <li><a href="Calendar.aspx"><i class="calendar"></i>Calendar</a></li>

    <li><a href="Bill.aspx"><i class="list"></i>Bills</a></li>

</ul>
</nav>

就像我说的，我还在学习，所以我不知道这是否将是更好地将其放置在一个的ContentPlaceHolder。我试图只是请求URL并做if语句，但我不知道如何设置id =

Like I said, I'm still learning so i'm not sure if it would be better to place it in a ContentPlaceHolder. I tried to just request the URL and do if statements but I wasn't sure how to set the id=.

任何帮助将是巨大的。

感谢

推荐答案

您应该考虑设置类您的菜单项，而不是 ID 作为重点，以显示它。

You should look into setting the class of your menu items rather than the id in order to display it as highlighted.

您可以做一些事情如此。结果
添加 ID 和 =服务器您的每一个环节：

You can do something as so.
Add an id and runat="server" to each of your links:

<li><a href="home.aspx" id="HomeLink" runat="server"><i class="home"></i> Home</a></li>
<li><a href="Calendar.aspx" id="CalendarLink" runat="server"><i class="calendar"></i>Calendar</a></li>
<li><a href="Bill.aspx" id="BillLink" runat="server"><i class="list"></i>Bills</a></li>

然后在你的母版页的code-的背后，你可以设置类各为他们导航到：

Then in the code-behind of your master page, you can set the classes to each as they're navigated to:

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

    private void SetCurrentPage()
    {
        var pageName = GetPageName();

        switch (pageName)
        {
            case "home.aspx":
                HomeLink.Attributes["class"] = "current";
                break;
            case "Calendar.aspx":
                CalendarLink.Attributes["class"] = "current";
                break;
            case "Bill.aspx":
                BillLink.Attributes["class"] = "current";
                break;
        }
    }

    private string GetPageName()
    {
        return Request.Url.ToString().Split('/').Last();
    }

这将设置类链接到您当前页面匹配电流。当然，你需要定义你的样式表类。但是，这应该工作。

This will set the class of link that matches your current page to current. Of course you will need to define that class in your style sheet. But this should work.

这篇关于ASP.NET C＃随着列表导航如何设置ID =＆QUOT;本期＆QUOT;主动导航页面？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！