Jqueryクラスを追加してページをリロードした後に保持する

Question

ページがリロードされた後にclickイベントでクラスを追加しておくことに問題があります。

のは、私はこのようなマークアップ持っていると仮定しましょう：

<ul class="menu"> 
    <a class="partial-link" href="{% url 'payment-technology-mainpage' %}"><li class="menu-first"><span class="line">ONE</span><span class="arrow">&rarr;</span></li></a> 
    <a class="partial-link" href="{% url 'insurance_mainpage' %}"><li class="menu-first"><span class="line">TWO</span><span class="arrow">&rarr;</span></li></a> 
    <a class="partial-link" href="{% url 'admin_mainpage' %}"><li class="menu-first"><span class="line">THREE</span><span class="arrow">&rarr;</span></li></a> 
    <a class="partial-link" href="{% url 'bok_mainpage' %}"><li><span class="line">FOUR</span><span class="arrow">&rarr;</span></li></a> 
    <a class="partial-link" href="{% url 'regio_dashboard' %}"><li class="menu-last"><span class="line">FIVE</span><span class="arrow">&rarr;</span></li></a> 
    <a class="partial-link" href="{% url 'intercity_mainpage' %}"><li class="menu-last"><span class="line">SIX</span><span class="arrow">&rarr;</span></li></a> 
    <a class="partial-link" href="{% url 'tickets-mainpage' %}"><li class="menu-last"><span class="line">SEVEN</span><span class="arrow">&rarr;</span></li></a> 
    <a class="partial-link" href="{% url 'angular-tickets' %}"><li class="menu-last"><span class="line">EIGHT</span><span class="arrow">&rarr;</span></li></a> 
</ul> 

私は「」要素内の「スパン」を「アクティブ」クラスを追加し、ページがリロードされた後、それを維持したいと思います。 は、私はこのような何かしようとした：

var menuItem = $("span.line"); 
menuItem.on("click", function(e) { 
    menuItem.removeClass("active"); 
    $(this).addClass("active"); 
}); 

をしかし、それは動作しません:( を私はすべてのアイデアを感謝するよ

EDIT それともあなたは他のソリューションを持っています。

Answer 1

HTMLはステートレスです。これは、一度ページを更新すると再作成され、その間に起こった可能性のある変更を「忘れる」ことを意味します。以前 ページセッション。

カルステンが彼のコメントで述べたように、localStorageはオプションです（実装にはあまり慣れていませんが）。

また、別のmenuItemが選択されるたびに更新されるCookieを保存することもできます。現代のブラウザではCookieが有効になっているので、menuItemが選択されたときにCookieを設定すると、ページの読み込み時に現在のCookieがチェックされ、それに応じてmenuItemが強調表示されます。クッキーは、特定のmenuItemのIDまたは他の一意の識別子を格納することができます。