Javascript 在本地存储中刷新页面时，我无法存储复选框状态？

我无法存储复选框状态。我尝试将状态存储在本地存储中，但页面刷新后，复选框中的勾号消失

<form>
    <input type="checkbox" id="checkbox1" onchange = "save();">Tick the check box</input>
</form>
<script>
    function save() {
        var checkbox = document.getElementById('checkbox1');
        localStorage.setItem('check', checkbox.checked);
    }

    window.onload()=function() {    
        var checked = JSON.parse(localStorage.getItem('check'));
        document.getElementById("checkbox1").checked = checked;
    }
<script>

勾选复选框
函数save（）{
var checkbox=document.getElementById（'checkbox1'）；
setItem（'check'，checkbox.checked'）；
}
window.onload（）=函数（）{
var checked=JSON.parse（localStorage.getItem（'check'）；
document.getElementById（“checkbox1”）.checked=checked；
}

使用

window.onload（）

调用函数，而不是声明它。改变

window.onload()=function(){  

到

如果您使用jQuery，还有一种更好的方法：

<input type="checkbox" id="checkbox1" />
<label for="checkbox1">Tick the check box</label>

jQuery有一个函数，名为。您不需要解析

localStorage。检查
，因为它的值不是JSON对象。
localStorage
中的所有内容都存储为字符串，
localStorage.check==“true”
将为您提供一个真正的布尔值。如果用户没有单击复选框，还需要一个默认值，
false
<代码>文本
是无效语法。如果您想要“可点击”文本，请使用


编辑：对于表单中的所有复选框：

<form id="myForm" method="post" action="some.php">
    <input type="checkbox" id="checkbox1" />
    <label for="checkbox1">Tick the check box</label>
    <br />
    <input type="checkbox" id="checkbox2" />
    <label for="checkbox2">Tick the check box</label>
    <br />
    <input type="checkbox" id="checkbox3" />
    <label for="checkbox3">Tick the check box</label>
</form>

两个变化：

将
window.onload（）=
更改为
window.onload=
当复选框使用
.addEventListener（“更改”，保存）
更改值时，请记住调用
save（）

//我们的复选框
var checkbox=document.getElementById（'checkbox1'）；
//此函数用于保存复选框值：
函数save（）{
setItem（'check'，checkbox.checked'）；
}
//此函数将重新加载复选框，就像从localStorage加载复选框一样：
window.onload=函数（）{
var checked=JSON.parse（localStorage.getItem（'check'）；
checkbox.checked=选中；
}
//当复选框更改时，请记住保存：
复选框.addEventListener（“更改”，保存）

勾选复选框

您的问题的其他解决方案（更正
窗口。加载
）似乎不错（另请参阅）：

如果您想执行JSON.parse（）来恢复数据，那么在存储看起来更干净之前，将数据编码为JSON。所以你可以

localStorage.setItem("check", JSON.stringify(checkbox.checked));

而不是

localStorage.setItem('check', checkbox.checked);


如果您只想在浏览器会话中使用持久性（您说过“页面刷新时”），可以使用。浏览器结束后，此选项将被清除，但在浏览器处于活动状态时保存。正如（对于许多站点而言，这可能会累加起来），这会在重新加载之间保存数据，但不会使用户的计算机变得混乱

window.onload（）=function（）{
应该是
window.onload=function（）{
@charlietfl
localStorage.item=true
转换为
“true”
@charlietfl@klenium请记住他使用的是
JSON.parse（）
将字符串转换为布尔值。感谢您的回答，因为您编写的代码仅用于单个复选框，并且可以为多个复选框编写几行代码，以便它适用于表单中的所有复选框。@satish更新了我的答案。
$(function()
{
    $("#myForm input[type='checkbox']").change(function()
    {
        localStorage[$(this).attr("id")] = this.checked;
    });
    $("#myForm input[type='checkbox']").each(function()
    {
        var val = localStorage[$(this).attr("id")];
        var isChecked = val !== undefined ? val == "true" : false;
        $(this).prop("checked", isChecked);
    });
});

localStorage.setItem("check", JSON.stringify(checkbox.checked));

localStorage.setItem('check', checkbox.checked);