本地存储未保存复选框未选中阶段

Local storage not saving the checkbox unchecked stage

本文关键字:保存 存储 复选框      更新时间:2023-09-26

我使用jquery和本地存储来保存复选框的状态。

我使用:

function save_form() {
    window.localStorage.setItem('fb_show', $('#fb_show').val());
    alert('Saved');
}
function load_form() {
    var fb_checkbox_val = window.localStorage.getItem('fb_show');
    alert(fb_checkbox_val);
    if (fb_checkbox_val == 'on') {
        $("#fb_show").prop("checked", true);
    } else {
        $("#fb_show").prop("checked", false);
    }
}

问题是,当它未被选中时,它会将值保存为"on",以便该部分工作,但是当我取消复选框并再次保存时,它仍然保存为"on"…所以后面的代码会将其设置为已检查。

我该如何解决这个问题?

您应该将复选框的状态保存在localStorage:

function save_form() {
    window.localStorage.setItem('fb_show', $('#fb_show').is(':checked'));
    alert('Saved');
}
function load_form() {
    var fb_checkbox_val = window.localStorage.getItem('fb_show') === 'true' ? true : false;
    alert(fb_checkbox_val);
    $("#fb_show").prop("checked", fb_checkbox_val);
}

未选中的复选框实际上没有值,因此您必须检查是否选中并保存该值。$("#fb_show").is(":checked")