從下拉列表中保存和重置值

Question

我有一個下拉列表，從中選擇值后，我按下按鈕並進行了一些計算。 我以此從列表中保存價值：

     <select name="dropDownTo" id="dropDownTo">
        <option value="Yard">Yard</option>
            <option value="Feet">Feet</option>
        <option value="Metre">Metre</option>
     </select>                          

    <button onclick="MyFunc()">Update</button>

<script>
document.getElementById("dropDownTo").onchange = function() {
         localStorage['dropDownTo'] = document.getElementById("dropDownTo").value;
        }
    function MyFunc(){
        document.getElementById("dropDownTo").value = localStorage['dropDownTo'];

        window.onload  = document.getElementById("dropDownTo").value;
        alert(document.getElementById("dropDownTo").value);
    }
</script>

但是選擇值在關閉窗口后保持選中狀態。 關閉頁面后是否可以恢復默認值？

Answer 1

您應該在頁面退出之前運行一個操作，將值恢復為默認值。 有一個javascript事件。 Window.onbeforeunload

window.onbeforeunload = function(){
    return 'You are leaving this page';
}

Answer 2

將值設置為選定將在每次加載頁面時首先選擇該值：

<option value="value2" selected>Value 2</option>