使用JavaScript刷新页面时未保存的更改

我想这样做： -单击复选框div=true或div=flase时，将显示或隐藏 -要保存的复选框的状态，以及使用此复选框，甚至最后调用的要保存的方法的状态

问题 -刷新页面时会保存复选框的状态，但不会保存最后调用的方法

我不明白我的错误在哪里

代码如下：

<input type='checkbox' id='LineOp' />  Show/Hide Weekends
<div id="true">
    <p>Hide weekend</p>
</div>
<div id="false">
    <p>Show weekend</p>
</div>



function SaveLastCheck() {
    var getStstus = localStorage.getItem("LineOp");

    if (getStstus === "true")
        $("#LineOp").prop("checked", true);

    $("#LineOp").click(function(){
        localStorage.setItem('LineOp', $(this).prop("checked"));
    });

}

$(document).ready(function() {
    SaveLastCheck();
});

$(document).ready(function show_weekends () {
    var checkbox = $('#LineOp'); 
    var dependent = $('#true');
    if (checkbox.attr('checked') !== undefined){
      dependent.show();

    } else {
        dependent.hide();

    }

    checkbox.change(function(e){
       dependent.toggle(); 
    });
});


$(document).ready(function hide_weekends () {
    var checkbox = $('#LineOp'); 
    var dependent = $('#false');
    if (checkbox.attr('checked') == undefined){
      dependent.show();

    } else {
        dependent.hide();

    }

    checkbox.change(function(e){
       dependent.toggle(); 
    });
});

---

下面是我的示例

如果您使用jQuery检查初始状态，那么它将起作用，您可以通过将复选框状态传递给来缩短代码。这样就不需要复制代码了

例如：

以下是更新后的示例：

---

另请参阅检查复选框状态的更多示例。

可能重复的@Silviu：请将答案标记为已接受，然后在答案旁边选中复选标记。由于您是新用户，请参加本教程以了解如何使用stackoverflow：

$(document).ready(function() {
    SaveLastCheck();

    var checkbox = $('#LineOp'); 
    $('#true').toggle(checkbox.is(':checked'));
    $('#false').toggle(!checkbox.is(':checked'));
    checkbox .change(function () {
        $('#true').toggle(this.checked);
        $('#false').toggle(!this.checked);
    });
});