jQuery CSSを元に戻す変更！

Question

私は、ASP.NET Masterpageでいくつかのタブ付きナビゲーションをセットアップしました。

<div id="nav_tabs"> 
     <div id="home" class="tab selected_tab "><a href="Default.aspx" onclick="tabSwitch('home');">Home</a></div> 
     <div id="products" class="tab other_tab "><a href="ProductList.aspx" onclick="tabSwitch('products');">Products</a></div> 
     <div id="demos" class="tab other_tab "><a href="Demos.aspx" onclick="tabSwitch('demos');">Demos</a></div> 
    </div> 

そして、私は現在のタブ設定するには、次のjQueryを使用します：それはかなり基本的である私は、タブのいずれかをクリックしたときに、変更が簡単に示されているいくつかの理由について

<script type="text/javascript" > 
     function tabSwitch(tab) { 
      $('.tab').css("background-image", "url('/Images/other_Tab.png')"); 
      $("#" + tab).css("background-image", "url('/Images/Active_Tab.png')"); 
     } 
    </script> 

を、しかし、それらは元の状態に戻ります。これはMasterPageの副作用ですか？私はちょうど何か間違っていますか？

Answer 1

問題は、jQueryの変更後にCSSページのリロードが発生することです。もちろん要素は元の状態に戻ります。

マスターページはページを作成するのに便利な方法ですが、フレームセットではありません。したがって、サーバー側でスタイルの変更を実装するか、何らかの形で変更を保持する必要があります（たとえば、クッキーにタブの数を保存し、そのクッキーに基づいてすべてのリロードでcssを更新するなど）。私はあなたのケースではサーバー側の方法が良いと思います。