3

私はまだasp.netを学んでおり、id="current"をナビゲーションバーに設定して、ユーザーがいるページに応じてそのページを強調表示する簡単な方法があるかどうかを知りたいと思っていました。私のテンプレートは id="current" を使用してリンクのスタイルを変更するように設定されており、各タブのスタイルを設定するクラスがあります。

これが私の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= の設定方法がわかりませんでした。

どんな助けでも素晴らしいでしょう。

ありがとう

4

3 に答える 3

7

メニュー項目をハイライト表示するにclassは、 ではなくを設定する必要があります。id

あなたはそのように何かをすることができます。各リンクにandを
追加します。idrunat="server"

<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>

次に、マスター ページのコード ビハインドで、移動先のクラスをそれぞれに設定できます。

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();
}

これにより、現在のページに一致するリンクのクラスが に設定されますcurrent。もちろん、スタイルシートでそのクラスを定義する必要があります。しかし、これはうまくいくはずです。

于 2013-02-04T16:22:34.953 に答える
0

プログラムでコントロールに ID を設定するのはあまり良い方法ではありません...「現在」またはアクティブな状態をどのように判断するかによって異なります。

ASP.NET フォームを使用している場合は、Menu ASP.NET コントロールの使用を検討できます。これにより、クラスが「アクティブ」アイテムに割り当てられ、ASP.NET サイトマップとペアリング/データバインドできます。

ASP.NET フォームを使用したくない場合は、href タグに関数評価を配置し、ASP.NET マスター ページのコード ビハインドで関数を宣言できます。何かのようなもの

<a href="home.aspx" class="<% CurrentOrNot("home") %>"> ...

次に、文字列を返す関数を宣言します。

public void CurrentOrNot(string navItem)
{
    //Do evaulation on URL to determine if we're on the current one or not.
    //pseudocode: if(navItem == Current.Url) return "mycssclassthatiscurrentnav"; else "";

}

独自のロールを作成する前に、ASP.NET メニューを確認してください。

于 2013-02-04T16:18:07.303 に答える
0

これはおそらく最良の答えではありませんが、最近、あなたが試みていることに似たようなことをしようとしました。まず、各メニュー リンクの css クラスを表す変数を設定します。次に、現在のファイル パスを取得し、そこに場所が含まれているかどうかを確認します。次に、ページがアクティブかどうかに基づいて css クラスを設定します。

 @{
            //some how find out what page we are on so we can set the active attribute
            var HomeClass = "non-active";
            var AboutClass = "non-active";

            string path = HttpContext.Current.Request.FilePath;
            if (path.Contains("Home"))
            {
                HomeClass = "active";
            }
            if (path.Contains("About"))
            {
                AboutClass = "active";
            }



    }

次に、メニューのクラス属性に対してこれを行いました

<a href="/home" class="@HomeClass"></a>
< a href="/about" class=@AbouitClass"> </a>
于 2013-02-04T16:19:14.213 に答える