JavaScriptでポストバックした後にドロップダウンから選択した値を維持する

Question

ポストバック後にドロップダウンリストの選択値を保持したい場合、ポストバック後にドロップダウンリストの選択値を保持する方法を理解しようとしています。この関数の

私はドロップダウンリストから選択した値を取得し、私は、ローカルストレージに保存します、ページの読み込みに

document.onreadystatechange = function() { 
    if (document.readyState === 'complete') { 
     window.localStorage.setItem("Rooms", $("#Rooms option:selected").val()); 
     window.localStorage.setItem("Persons", $("#Persons option:selected").val()); 
     window.localStorage.setItem("Childrens", $("#Childrens option:selected").val()); 
    } 
} 

私はと呼ばれるadddate()機能があります。以下

function AddDate() { 
    var date = moment(); 

    document.getElementById('Arrival').value = date.format('DD/MM/YYYY'); 
    document.getElementById('Departure').value = date.add(1, 'days').format('DD/MM/YYYY'); 
    $("#Arrival").val(window.localStorage.getItem("Arrival")); 
    $("#Departure").val(window.localStorage.getItem("Departure")); 
    $("#Rooms option:selected").val(window.localStorage.getItem("Rooms")); 
    $("#Persons option:selected").val(window.localStorage.getItem("Persons")); 
    $("#Childrens option:selected").val(window.localStorage.getItem("Childrens")); 
}; 
window.onload = AddDate; 

は私の選択リストであります：

<select id="Rooms" name="Rooms" class="dropdown"> 
    @for (int i = 1; i <= Model.MaximumNumberOfRooms; i++){ 
     <option value="@i">@i</option> 
    } 
</select> 

私は動作しなかった多くのオプションを試しました

ご意見はありますか？ありがとう。

Answer 1

これは動作します。

ドロップダウンを変更し、ページを更新します。

$('document').ready(function(){ 
     $("#Rooms").val(window.localStorage.getItem("Rooms")); 
    }); 

    $("#Rooms").on('change',function(e){  
     window.localStorage.setItem("Rooms", $("#Rooms option:selected").val()); 
    }); 

https://jsfiddle.net/HappyiPhone/rpnoarof/1/

Answer 2

#Rooms option:selectedに値を設定しても機能しません。代わりに$("#Rooms").val(...)を試してください。

同じことが値を保存する前に選択しますが、あなたのコードもそこで動作すると思います。