2011-12-07 7 views
0

選択メニューからそれぞれのオプションを選択すると、表示されるか非表示になる2つのスパンがあります。デフォルトでは、両方のスパンはCSSのdisplay: noneに設定されています。私は、ページがリロードされた後に現在表示されている範囲の可視性を維持したいと考えています(たとえば、検証エラーがあった場合など)。ページをリロードした後、選択メニューを切り替えるdivの状態をどのように維持しますか?

これはチェックボックスで行いましたが、簡単でしたが、選択メニューではわかりません。

// Toggles the div based on selected option 
$(function() { 
    $('#maintenanceIntervalId').change(function() { 
     var value = $('#maintenanceIntervalId option:selected').val() 

     switch(value) { 
      case "2": { 
       $("#weekly-maintenance-on").show(); 
       $("#monthly-maintenance-on").hide(); 
       break; 
      } 
      case "3": { 
       $("#monthly-maintenance-on").show(); 
       $("#weekly-maintenance-on").hide(); 
       break; 
      } 
      case "1": { 
       $("#weekly-maintenance-on").hide(); 
       $("#monthly-maintenance-on").hide(); 
       break; 
      } 
     } 
    }); 
}); 

上記のとおりです。しかし、

toggleMaintenanceDiv($('#maintenanceIntervalId option:selected'))

これは動作しません。しかし、ページのリロード後に目に見える滞在する現在可視スパンを得るために、私は、独自の機能toggleMaintenanceDiv()にswitch文を移動して、次の行を追加しました。

HTML:

<select id="maintenanceIntervalId"> 
    <option value="1">Day</option> 
    <option value="2">Week</option> 
    <option value="3">Month</option> 
</select> 

<span id="weekly-maintenance-on">Stuff one</span> 
<span id="monthly-maintenance-on">Stuff two</span> 

答えて

0

スクリプトはJavaScriptをすべての変数や状態がリロード後に失われます、ページの読み込みをするたびにリロードされます。表示可能なスパンIDをCookieに保存できると思います。毎回ページが読み込まれると、Cookieが最初にチェックされ、対応するスパンが表示されます。

+0

この場合、Cookieが必要かどうかはわかりません。これを見てください:http://stackoverflow.com/questions/8406336/how-do-you-maintain-the-state-of-a-checkbox-toggled-div-after-page-reload – Mohamad

関連する問題