0

これは123と同じくらい簡単だと思いますが、現在アクティブな「li a」要素にクラス「アクティブ」を動的に追加するJSを使用したナビゲーションがあります。ページがホーム リンク (ユーザーがページに入ったときに表示される最初のリンク) を読み込むときに、「.active リンク」が含まれるように JS コードを変更する方法。これが私の例です！

http://jsfiddle.net/SZ63C/

JS:

$('li a').click(function (e) {
    e.preventDefault();
    $('a').removeClass('active');
    $(this).addClass('active');
});

ホームリンクは、最初から「アクティブ」クラスにある必要があります...

jsfiddle を見て、可能であれば助けてください。

4

5 に答える 5

1

HTMLのホームリンクにアクティブなクラスを追加できます。これを処理するためにjavascriptは必要ありません。

  <li><a href="#Home" class="scroll active">Home</a></li>
                                 //-^^^^^^--here

必要に応じて、eq を使用できます。

$('.scroll:eq(0)').addClass('active');

document.ready 関数内

ここでフィドル

于 2013-10-21T05:16:29.073 に答える
0

ドキュメント準備機能を使用して、コードを書き込みます。以下のリンクから助けてください: http://learn.jquery.com/using-jquery-core/document-ready/

于 2013-10-21T07:05:19.413 に答える
0 
 $(document).ready(function(){
   $('li a:eq(0)').addClass("active");// here add active class on load
    $('li a').click(function(e) {
            e.preventDefault();
            $('a').removeClass('active');
            $(this).addClass('active');
        });
});

デモを見る

参照式セレクター

于 2013-10-21T05:16:38.007 に答える
0

アクティブなクラスを任意のページに動的に追加したい場合は、次のようにしてみてください。

$("li a").each(function(){
   if( $(this).attr('href').indexOf( window.location.pathname ) !== -1 ){
       $(this).addClass('active');
       return false; // case found, break each loop;
   }
});

それ以外の場合は、ホーム リンクのみに追加するだけで、別の試行は行わない場合:

$("li a").first().addClass("active");
于 2013-10-21T05:19:24.730 に答える
0

あなたはこれを行うことができます：

$('.scroll').first().addClass('active');
  • .first()メソッドを使用して最初のリンクを取得します。
  • active次に、クラスをリンクに追加します。

デモ:フィドル

簡単なパフォーマンスのヒント:

以下のコードを使用して、既にクラスがあるリンクのみからクラスを削除します。すべてのリンクから不必要にクラスを削除する必要はありません。

$('a.active').removeClass('active');

これにより、クラスを持つすべてのリンクが検索され、activeそのクラスが削除されるため、すべてのリンクをチェックする必要がなくなり、効率が向上します。

于 2013-10-21T05:17:03.663 に答える