JQuery addClassは永続的ではありません

Question

私はDjangoで開発しているWebアプリケーションを持っています。ユーザーがサイト上のどこにいるかを簡単に追跡できるようにしています。 メニューでクリックした項目のCSSを変更すると思いました。

この単純なコードを追加しました。

<script type="text/javascript"> 
     $(document).ready(function(){ 

     $(".up_menu_item").click(function(){ 
       $(this).addClass("green"); 
       var excludeThis = $(this); 
       $(".up_menu_item").not(excludeThis).each(function(){ 
         $(this).removeClass("green"); 
       }); 
     }); 

     }); 
     </script> 

メニュー項目をクリックすると、色が変わりますが、直後にデフォルトに戻ります。私がクリックした項目は実際には、ユーザーを別のURLにリダイレクトするタグです。しかし、メニュー（とjavascript）は常に呼び出されるURLに含まれているので、クラスが残っていると思いました。

私は非常にはっきりしているのか分かりませんが、これが私を狂ってしまい始めているので、助けていただければ幸いです。

Answer 1

クラスを新しい要素に読み込む前に、すべての要素からクラスを削除する方が簡単なのでしょうか？

$(".up_menu_item").click(function(){ 
    $($(this).attr('class')).removeClass(); 
    $(this).addClass("green"); 
}); 

Answer 2

別のページに移動すると、Javascript（またはjQueryは自然に）で適用されたすべての変更がなくなりました。ページは通常通りに読み込まれます。すべての変更は、現在表示されているページのに適用されます。後に続くページは変更されません。

ページが読み込まれたときに開いているページを確認し、対応するボタンの色を変更できます。最善の方法は、ページが右ボタンと一致する場合は、サーバー側のプログラミング言語（あなたの場合はDjangoフレームワークを使用するPython）を使用してクラスを追加することです。

Answer 3

Javascriptはこれに適したツールではありません。コメントでKimが言うように、あなたがページをリロードするとき、あなたのクラスはもはや存在しません。

Djangoを使用しているので、これを行う方法はDjangoテンプレートにあります。メニュー内の各URLについて、現在のURLと一致するかどうかをチェックし、そうであればクラスを追加します。

編集あなたは（あなたがrequest context processorを有効にした場合は自動的に行われます）あなたのテンプレートにリクエストを渡されてきたと仮定すると、request.pathから現在のURLを取得することができます。