消息关闭
    暂无新消息!
html代码

<select id="select_budgetary" name="budgetary" style="width: 100%">
     <option value="0">预算内</option>
     <option value="1">预算外</option>
</select>


离开页面时保存选中的value

window.onbeforeunload = function () {
    var storage = window.localStorage;
    if (window.localStorage) {
     var select_budgetary = document.getElementById('select_budgetary');
        storage.setItem("budgetary", $('#select_budgetary').val());
        console.log($('#select_budgetary').val());
     }
     return;
}


加载页面时读取value设置select选中状态

$(document).ready(function () {
    var storage = window.localStorage;
    console.log(storage.getItem("budgetary"));
    var select_budgetary = document.getElementById("select_budgetary");
    for (var i = 0; i < select_budgetary.options.length; i += 1) {
         if (select_budgetary.options[i].value == storage.getItem("budgetary")) {
            select_budgetary.options[i].selected = true;
            break;
         }
    }
});

现在的问题是离开页面和加载页面时打印的value是正常的,在加载页面后select的选中状态依旧是默认状态,点开select后的高亮选项却是和localStorage读取的value对应的,但select的文本一直没有变化。

前端小白阶段,请问各位大大怎么解决这个问题。

0个回答

暂无回答!