javascript - 在本地存储中存储复选框值

Question

我有一个复选框，其值 $row['uid'] 我想使用 javascript 或 jquery 存储在本地存储中。当用户“取消选中”该复选框时，该值应该从本地存储中删除

这是我的 html:

<form> Favorites <input type="checkbox" class="favorite" value="'.$row['uid'].' onclick='.fave.add();'"></form>

这就是我目前在 javascript 中的本地存储。我不太确定应该如何添加和删除值 $row['uid']

    var fave = fave || {};
    var data = JSON.parse(localStorage.getItem("favorite"));
    data = data || {};
            var fave = fave || {};
            var data = JSON.parse(localStorage.getItem("favorite"));
            data = data || {};
            $(function () {
                var data = localStorage.getItem("favorite");

                if (data !== null) {
                    $("input[name='favorites']").attr("checked", "checked");
                }
            });
            $("input[name='favorites']").click(function () {
                if ($(this).is(":checked")) {
                localStorage.setItem("favorite", $(this).val());
                } 
                else {
                    localStorage.removeItem("favorite");
                }
            });

非常感谢任何帮助!

Answer 1

localStorage 有两个主要函数，getItem 和 setItem。对于 setItem，您传入一个键和一个值。如果您再次写入该键，它将重写该值。因此，在您的情况下，如果选中一个框，您将执行 localStorage.setItem("checkbox_value", true) ，当未选中时，您将传入 false 。要获得值，您可以像这样使用 jQuery:$(checkbox).is(':checked') 并使用简单的 if-else 子句传入 true 或 false。然后当您重新加载页面时，在 $( document ).ready() 上，您可以使用 localStorage.getItem(key) 获取值并使用 Javascript 设置复选框值(value)观。

这就是我将如何使用 localStorage 来记住复选框的值。

希望我有所帮助!有什么不明白的可以问我。