我有一个情况，即在用户填写表单时，网页可能因某种原因刷新。不希望的效果是抹掉用户已经输入的数据。
是否有解决方案使表单数据在页面刷新时保持不变？
该表单包括文本输入和选择。
3个回答
1
你说：“我有一个情况，某些原因导致网页可能会刷新”，你是指用户可能会刷新页面，还是其他脚本会刷新页面？如果是后者，你应该尝试修复导致刷新的问题，而不是试图保留表单数据。如果是前者，JavaScript 可能是你的解决方案。
你可以监听任何表单元素上的每个 keyup 事件。当 keyup 事件被触发时，你将序列化表单数据并将其写入 cookie（或 web 存储，取决于你需要支持哪些浏览器），以保留最新的数据。如果页面重新加载，或者用户离开页面并返回，可以在文档准备就绪时反序列化 cookie，并使用 cookie 中的数据重新填充表单。当你提交表单时，一定要清除 cookie，以确保下次用户加载页面时不会填充表单。
更新：
你可以监听任何表单元素上的每个 keyup 事件。当 keyup 事件被触发时，你将序列化表单数据并将其写入 cookie（或 web 存储，取决于你需要支持哪些浏览器），以保留最新的数据。如果页面重新加载，或者用户离开页面并返回，可以在文档准备就绪时反序列化 cookie，并使用 cookie 中的数据重新填充表单。当你提交表单时，一定要清除 cookie，以确保下次用户加载页面时不会填充表单。
更新：
这是一篇关于如何使用GSerializer在JavaScript中进行序列化和反序列化的好博客文章。
- Christofer Eliasson
4
谢谢。我知道我可以使用jQuery进行序列化，但反序列化怎么办？有没有相应的函数，还是我必须从头开始编写脚本？ - Christophe
页面刷新不受用户控制，其目的是更新页面内容（无ajax）。 - Christophe
@Christophe 我在我的回答中更新了一些有关JavaScript序列化/反序列化的信息。 - Christofer Eliasson
说句实话，我是GSerializer的原始作者，虽然它可能有一个简单的界面，但像@paislee建议的那样，本地存储可能是现在更好的选择。也许我会在以后加入本地存储。你上面提到的用例是我接下来要处理的问题（在移动设备上最烦人！） - Matthew Fellows
1
一个建议的方法
当用户填写表单时，运行JavaScript将输入的值缓存到LocalStorage、cookie或通过AJAX的会话变量中。
在页面加载时，检查这些条目是否存在，并使用JavaScript填充表单。
在表单提交时，清除这些条目。
- calebds
0
使用HTML5 Web存储-它比Cookie更快，更安全。您可以查看W3Schools网站获取一些快速和基本的示例：http://www.w3schools.com/html5/html5_webstorage.asp
- Kurt
网页内容由stack overflow 提供, 点击上面的可以查看英文原文，
原文链接
原文链接