保留表单数据的策略（在选项卡/浏览器关闭上）答案

【问题标题】：Strategies for preserving form data ( on tab/browser close )保留表单数据的策略（在选项卡/浏览器关闭上）
【发布时间】：2010-12-08 01:12:26
【问题描述】：

我遇到了一个任务管理应用程序的问题，用户偶尔会关闭他们的浏览器/标签，并且他们键入的信息会因为他们不小心关闭浏览器/标签而消失，从而导致他们输入的文本丢失（有些人可以花半个小时输入文字）。

所以我必须提供一个解决方案，我有几个想法，但想要最好的建议，或者如果你有更好的解决方案，请告诉我。

选项 1：

在window.onunload 或window.onbeforeunload 事件中调用confirm() 对话框并首先测试任务记录区域中是否有任何文本且不为空白。如果它不为空，请调用 window.confirm() 并询问用户是否要关闭选项卡/窗口而不保存日志。

我对选项 #1 的担忧是它可能会干扰用户。

选项 2：

在同一事件中，不要调用任何 confirm()，而是将任务日志区域中的文本强制保存在 cookie 中。然后可能会提供一个按钮，尝试从同一页面上的 cookie 中恢复任何已保存的任务信息，因此点击该按钮将使其解析 cookie 并检索信息。

【问题讨论】：

【解决方案1】：

我会针对您正在使用的特定 Web 服务器/语言研究 AJAX 框架。 AJAX 允许您在输入表单数据时保存它（例如，这就是 Google Docs 的工作方式）。

【讨论】：

【解决方案2】：

window.onbeforeunload 事件有点奇怪。如果您为它定义一个处理程序，浏览器将通过离开页面显示有关丢失数据的通用消息，并将您从处理程序函数返回的字符串插入到消息的中间。见这里：

所以我们要做的是：当我们知道页面上的某些内容未保存时，我们设置：

window.onbeforeunload = function(){
 return "[SOME CUSTOM MESSAGE FROM THE APP]";
}

一旦用户保存，并且我们知道我们不需要向他们显示消息，我们设置：

window.onbeforeunload = null;

这有点侵入性，但总比您的用户意外丢失数据要好。

【讨论】：

【解决方案3】：

如果用户在提交他们一直在做的事情之前足够愚蠢地离开，那么他们不应该介意有人闯入询问他们是否打算做一些明显愚蠢的事情。

此外，SO 使用确认对话框来导航，并且这里的大多数（某些）用户非常聪明。

这是最容易使用的，并且可能会对用户提供更多帮助。

如果有人写了一段很长的文字，然后没有提交就关闭了浏览器，他们可能更乐意在那里解决问题，而不是第二天早上发现他们没有这样做......

【讨论】：