【发布时间】：2012-02-23 23:32:25
【问题描述】：
我有一种情况，由于某种原因，网页可能会在用户填写表单时刷新。不想要的效果是清除用户已经输入的数据。
是否有解决方案让表单数据在页面刷新时保持不变？
表单包括文本输入和选择。
【问题讨论】：
标签： javascript html forms
【发布时间】：2012-02-23 23:32:25
【问题描述】：
你说"I have a situation where for some reason a Web page might refresh"，你的意思是用户可能会刷新页面，还是其他一些刷新页面的脚本？如果是后者，您可能应该尝试修复导致刷新的问题，而不是尝试保留表单数据。如果是前者，JavaScript 可能会是你的解决方案。
您可以在任何表单元素上监听每个 keyup-event。当触发 keyup-event 时，您序列化表单数据并将其写入 cookie（或网络存储，取决于您需要支持的浏览器），以保留最新数据。如果页面重新加载，或者如果用户离开页面并返回，cookie 可以在文档就绪时反序列化，并且您可以使用 cookie 中的数据重新填充表单。发布表单时，请务必清除 cookie，以确保下次用户加载页面时不会填写表单。
更新
这是一个很好的blog post，关于如何使用GSerializer 进行序列化和反序列化 JavaScript。
【讨论】：
-
谢谢。我知道我可以例如使用 jQuery 进行序列化，但是反序列化将如何工作？有没有这样的功能，还是我必须从头开始编写脚本？
-
页面刷新不受用户控制，其目的是更新页面内容（无ajax）。
-
@Christophe 用一些关于 JavaScript 序列化/反序列化的信息更新了我的答案。
-
对于它的价值，我是 GSerializer 的原作者，虽然它可能有一个简单的界面，但 @paislee 建议的本地存储可能是这些天更好的选择。也许我会设法将本地存储添加到它的轨道上。您在上面建议的用例是我接下来要去的地方（在移动设备上最烦人！）
建议的方法
当用户填写表单时，运行 JavaScript，通过 AJAX 缓存 LocalStorage、cookie 或会话变量中输入的值。
在页面加载时，检查这些条目是否存在，并使用 JavaScript 填充表单。
在提交表单时，清除条目。
【讨论】：
使用 HTML5 网络存储 - 它比 cookie 更快、更安全。您可以查看 W3Schools 网站以获取一些快速和基本的示例：http://www.w3schools.com/html5/html5_webstorage.asp
【讨论】：