2011-07-18 11 views
2

私はリンクが付いた単純な順序付けられていないリストを持っています。シンプルasp.net webforms ul liメニュー選択されたクラス

<body> 
    <div id="topMenu"> 
     <ul> 
      <li><a class="selected" href="../Default.aspx">Start</a></li> 
      <li><a href="../Category/ShowAll.aspx">Categories</a></li> 
      <li><a href="../Elements/ShowAll.aspx">Elements</a></li> 
      <li><a href="../Articles/ShowAll.aspx">Articles</a></li> 
     </ul> 
    </div> 
    <asp:ContentPlaceHolder ID="MainContentPlaceholder" runat="server"> 
    </asp:ContentPlaceHolder> 
</body> 

リンクのクラスを「選択した」クラスに変更したいのですが、これはこれを行う最も簡単な方法です。私はそれをリンクボタンにしてセッションの情報を保存することを考えましたが、それは残酷に思われますが、より簡単なアプローチが必要ですか?

答えて

0

さて、あなただけrunat="server"する<a>を置くことができ、その後、分離コードからアクセスする:

hyperLink.Attributes["class"] = "opened"; 

あなたはメニューを使用して、マスターページでこれを持つことができ、あなたの子ページを送ることができます彼らは選択された必要なハイパーリンクのID、ご主人に

のようなもの(linkWrapperがrunat serverとしてご<ul>することができます):

(HyperLink)linkWrapper.FindControl(childPageMenuAnchorLinkId); 
あなたの子供は

masterPage.ChildPageMenuAnchorLinkId = "link_Customers"; 
+0

あなたはより多くの明確化が必要な場合はどうすればよい –

+0

を掲載私はmasterPageへの参照を取得します。私の子ページには、masterページだけを参照する「Master」オブジェクトしかありません。公共財を作る方法は? –

+0

マスターオブジェクトをマスターページタイプにキャストします。プロパティについては、自分で書きます。例のためにChildPageMenuAnchorLinkIdという名前を付けました。あなたはそれをどうにかしてはいけません。 –

0

あなたはあなたを助けるかもしれないjQueryの、この他のSO質問からのリンクを使用している場合。

jQuery add class .active on menu

EDIT:OPの用途に応じて 'アクティブ' ではない '選択された' クラスを使用する
修正したスクリプト。

だから、私は他の回答からスクリプトを「借りる」場合は、jQueryのを使用している場合、私は、再び、これは動作します信じて...

$(function(){ 
    var url = window.location.pathname, 
     urlRegExp = new RegExp(url.replace(/\/$/,'') + "$"); // create regexp to match current url pathname and remove trailing slash if present as it could collide with the link in navigation in case trailing slash wasn't present there 
     // now grab every link from the navigation 
     $('#topMenu ul li a').each(function(){ 
      // and test its normalized href against the url pathname regexp 
      if(urlRegExp.test(this.href.replace(/\/$/,''))){ 
       $(this).addClass('selected'); 
      } 
     }); 
}); 
関連する問題