Question

我正在为文档管理器设计一个Web应用程序，并且有一个“设置”页面，用户可以看到一对格式化为iphone切换按钮的复选框。它们可以正常工作，但每当用户离开网站或刷新页面时，这些按钮的状态将重置为默认状态。有没有办法使用 localStorage 保存它们的状态，还是需要使用 cookies ？ JavaScript文件中的 EDIT （下面显示的代码）有两个函数，一个叫做 saveSettings ，另一个叫 loadSettings ，但如果我不得不做这一切都在一个功能，然后请告诉我。 END OF EDIT 任何帮助都会非常感激。到目前为止我有;

localStorage.CheckboxName = $('#CheckboxName').val();

将复选框保存到 localStorage 和;

$('#CheckboxName').val(localStorage.CheckboxName);

但它不会保存。我做错了吗？

修改

这是两个复选框的HTML代码;

<li style = 'color: #FFFFFF;'>Notifications<span class = 'toggle'><input type = 'checkbox' class = 'toggle' name = 'notifications' id = 'notifications' /></span></li>
<li style = 'color: #FFFFFF;'>Preview<span class = 'toggle'><input type = 'checkbox' class = 'toggle' name = 'preview' id = 'preview' checked = "true" /></span></li>

END OF EDIT

任何帮助都会很棒，谢谢你提前x

Answer 1

我不确定，但我一直认为它是这样的：

window.localStorage.setItem('CheckboxName', $('#CheckboxName').val());

$('#CheckboxName').val(window.localStorage.getItem('CheckboxName'));

Answer 2

您可以尝试以下

$（“＃CheckboxName”）。is（'：checked'）？'checked'：'not'并保存输出，似乎是这里建议的： How to use local storage to retain checkbox states for filtering items

Answer 3

要存储项目，请记住商店只保存字符串。

例如

var val = $('#CheckboxName').val();
window.localStorage.setItem(key, JSON.stringify(val));

因此，当您读回值时，您需要反序列化字符串。

var str = window.localStorage.getItem(key);
var obj = $.parseJSON(str);

或者你可以根据你的需要更好地进行字符串比较，我会做的是将一个id值对的对象存储在一个存储键中并将它们反序列化以使用适当的对象

例如

var val = {
    CheckboxName1: true,
    CheckboxName2: false,
    CheckboxName3: false, // ect....
};
window.localStorage.setItem(key, JSON.stringify(val));

如何在localStorage中保存复选框状态

3 个答案: