在页面刷新时保留表单数据

Question

我有一种情况，由于某种原因，当用户填写表单时，网页可能会刷新。 不需要的效果是消除用户已输入的数据。

是否有解决方案让表单数据在页面刷新时保持不变？

表单包括文本输入和选择。

Answer 1

你说"I have a situation where for some reason a Web page might refresh" ，你是说用户可能刷新页面，还是其他一些刷新页面的脚本？ 如果案例是后者，您可能应该尝试修复导致刷新的问题，而不是尝试保留表单数据。 如果是前者，JavaScript可能就是您的解决方案。

您可以在任何表单元素上侦听每个keyup-event。 触发keyup-event时，您将序列化表单数据并将其写入cookie（或webstorage，具体取决于您需要支持的浏览器），以保留最新的数据。 如果页面重新加载，或者用户离开页面并返回，则可以在文档就绪时对cookie进行反序列化，并且可以使用cookie中的数据重新填充表单。 发布表单时，请确保还清除cookie，以确保下次用户加载页面时表单未填写。

更新

这是一篇很好的博客文章，关于如何使用GSerializer进行序列化以及使用JavaScript进行反序列化。

Answer 2

建议的方法

1. 当用户填写表单时，运行JavaScript，通过AJAX将输入的值缓存在LocalStorage ，cookie或会话变量中。

2. 在页面加载时，检查是否存在这些条目，并使用JavaScript填充表单。

3. 在表单提交上，清除条目。

Answer 3

使用HTML5网络存储 - 它比cookie更快，更安全。 您可以访问W3Schools网站获取一些快速和基本的样本： http ： //www.w3schools.com/html5/html5_webstorage.asp