javascript - 使用 localStorage 维护复选框的选中状态

Question

我正在尝试不使用jQuery制作一个 list ，其中每个复选框的.checked状态都保存在localStorage中，以便在浏览器甚至计算机重新启动时可以维护它。

Fiddle

为了实现这一目标，我编写了三个函数:

• saveStatus()，将所有复选框的当前状态保存到 localStorage。通过单击按钮激活。
• loadStatus()，从 localStorage 加载保存的状态。在 body 标记中激活 onload。
• clearAllInputs()，清除本地存储。通过按钮激活单击。

对于仅接受(“String”，“String”)键值对的 localStorage，我找不到更好的解决方法。

当我选中几个复选框并点击保存按钮时，它似乎只是刷新页面并且所有复选框都未选中。当我点击清除按钮时，也会发生同样的事情。

Answer 1

这就是 JSON 的用武之地。您可以使用对象或数组来存储复选框的状态。保存到 localStorage 后，对对象使用 JSON.stringify 将其转换为字符串。然后将该字符串保存到 localStorage。读取则相反，从 localStorage 读取字符串，然后使用 JSON.parse 将字符串转回对象或数组以在复选框上使用。