0

以下のように、マステページにメニューがあります。

<div class="navtop">
    <ul class="nav">
        <li class=""><a href="Default.aspx">Home</a></li>
        <li class=""><a href="Test.aspx">Link</a></li>
        <li class=""><a href="Hello.aspx">Link</a></li>
        <li class=""><a href="World.aspx">Link</a></li>
    </ul>
</div>

のクラス<li></li>をアクティブに設定するには、次の Javascript コードを使用しています。

<script>
    $("li").click(function () {
        alert("this is the message");
        if ($("li").hasClass('active')) {
            $("li").removeClass('active');
        }
        $(this).addClass('active');
    });
</script>

私はこれをどこかで見たので、これはうまくいくはずです。しかし、それは私にとってはうまくいきません。メニューは空の class="" のままで、(テストするための) JavaScript からの警告メッセージも機能しません。

誰かが私を助けることができますか？私は何を間違っていますか？

4

2 に答える 2

1

jQuery が正常に追加されたことを確認し、document.ready イベントにイベントをバインドします。あなたのコードはうまくいくようです。また、ここで締めくくりの引用を逃しましたclass="navtop

jQuery の追加

<script src="http://code.jquery.com/jquery-latest.min.js"
        type="text/javascript"></script>

document.ready にコードを入れる

ライブデモ

$(document).ready(function(){
   $("li").click(function (event) {
      event.preventDefault();      
      if ($("li").hasClass('active')) {
           $("li").removeClass('active');
      }
      $(this).addClass('active');
   });
});
于 2013-07-21T18:07:29.653 に答える
0

あなたのコードは単純な ASPX ページでは機能しません。テキストをクリックすると、アンカーをクリックし、新しいページをロードする別のページに移動します。

Javascript はクライアント側で実行されますが、リンクをクリックすると、新しいページで $(document).onReady(...) を再度呼び出す別の HTML ページをロードする他のページへのサーバー ナビゲーションが実行されます。

また、「event.preventDefault();」を入れると 広告クリック選択コードは onClick で機能しますが、ナビゲーション アクションは起動されず、メニューは他のページに移動しません。

マーカーを使用して現在使用されている子ページを検出するか、JavaScript で変数を変更して正しい項目をアクティブとしてロードするために、ASPX で選択状態を作成する必要があります。

ASPX を使用して、少なくとも ASPX メニュー コンポーネントと siteMap を使用することをお勧めします。これにより、ASPX コードの管理が改善されます。

ASP.NET の web.sitemap ファイルからメニューを作成する

于 2013-07-21T18:40:22.840 に答える