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

Save and reset values from drop down list

本文关键字:下拉列表 保存      更新时间:2023-09-26

我有下拉列表,选择值后,我按下按钮和一些计算。我从列表中保存值:

     <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>

但是select值在关闭窗口后保持选中状态。关闭页面后是否可以恢复默认值?

您应该在页面退出之前运行一个操作,将该值恢复为默认值。有一个javascript事件。Window.onbeforeunload

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

将值设置为selected将在每次加载页面时初始选择该值:

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