跟踪和存储多个复选框的已检查状态

时间:2013-01-10 14:48:14

标签: javascript cookies checkbox

希望你很好!我还在处理这个待办事项列表网站,我有点陷入困境,因为最好的方法是跟踪其中一个项目是否标记为已完成,然后如何更新存储待办事项的cookie只加载一个选中的复选框。

我已经看过像卸载和onbeforeunload这样的事情,这似乎是一种可行的方法,检查页面上的每个复选框,然后将状态存储在cookie中,以便下次用户访问该页面。

但我想知道是否还有其他建议? W3schools认为onunload在Opera或Chome中不起作用(令人震惊!)如果是这样的话,那将是一个明确的禁忌。

谢谢你们!

哦,link to the site如果你想要一个mooche。这是一个vanilla JavaScript项目,就像一个FYI:)

1 个答案:

答案 0 :(得分:0)

为什么不在复选框上clickchange或甚至blur点击某些内容?

如果我这样做,我可能会使用localStorage而不是cookie - 除非我不得不以某种方式将数据转发到服务器。 (即便如此,我会使用localStorage,然后AJAX将内容发布到服务器上。)

为了澄清一点,而不是每个条目的cookie(这将导致你的方式出现大小问题),我会使用类似的东西:

var checklist = []; // Make an array

单击复选框后,获取单词等

checklist.push({'title': 'Eat some carrots', 'description': 'Orange ones', 'Urgent': 0});

checklist.push({'title': 'Eat some cheese', 'description': 'Cheddar - I hate brie', 'Urgent': 1});

然后显示,循环检查清单数组以绘制到屏幕上(不过你已经这样做了)

如果要保存此对象数组,请使用:

localStorage.checklist = JSON.stringify(checklist); // Now our checklist from above is stored in a variable in localStorage called checklist.

并回读:

checklist = localStorage.checklist;

如果你真的需要在服务器上使用它,你可以在那里发布清单,但你可能没有。 现在可以添加应用程序缓存(http://www.html5rocks.com/en/tutorials/appcache/beginner/),它也可以脱机工作。 :)