保留表单数据的策略(在选项卡/浏览器关闭时)

Question

我有一个任务管理应用程序的问题,偶尔用户关闭他们的浏览器/标签和他们键入的信息会因为他们意外关闭浏览器/标签而丢失,导致他们输入的文本丢失(有些人可以花半小时进入文本).

所以我必须提供一个解决方案,我有一些想法,但想要最好的输入,或者如果你有一个更好的解决方案让我听到你.

选项1:

在window.onunload或者可能的window.onbeforeunload事件上调用confirm()对话框,首先测试任务日志记录区域中是否有任何文本并且不是空白.如果它不是空白,则调用window.confirm()并询问用户是否要在不保存日志的情况下关闭选项卡/窗口.

我对选项#1的关注是它可能是用户侵入性的.

选项2:

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

Answer 1

window.onbeforeunload事件有点奇怪.如果为其定义处理程序,浏览器将显示关于通过导航离开页面而丢失数据的一般消息,并将从处理函数返回的字符串插入到消息的中间.看这里:

那么我们做什么:当我们知道页面上的内容未保存时,我们设置:

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

一旦用户保存,我们就知道我们不需要向他们展示消息,我们设置:

window.onbeforeunload = null;

它有点干扰,但它比用户意外丢失数据更好.