确认浏览器退出/浏览器退出技术答案

【问题标题】：Confirm Browser Exit/ On Browser Exit Techniques确认浏览器退出/浏览器退出技术
【发布时间】：2010-10-19 09:28:07
【问题描述】：

我已经四处寻找了一段时间，但还没有完全找到我一直在寻找的东西。我的网页存储报告，用户可以保存这些报告。

我正在寻找一种方法，使用 jquery 或 javascript onunload/onbeforeunload 在浏览器关闭/导航时询问用户是否希望保存报告或继续而不保存。

使用 onbeforeunload 我可以让用户停止导航并手动保存，尽管我希望通过对话框完成保存。 onbeforeunload 的另一个问题是点击标签也会调用 onbeforeunload 方法。

保存是异步的，需要几毫秒。

欢迎提出任何建议。

问候，拜伦·科布。

【问题讨论】：

为什么你不总是保存而不打扰用户并允许在用户下次显示页面时轻松撤消？ “上次关闭页面时，系统会自动为您保存一份报告 [撤消]”
问题在于，用户还可以创建新报告，并且在保存时必须为报告命名。不过，我是按照这些思路思考的。

标签： javascript jquery onunload browser-close

【解决方案1】：

这可能是唯一一次合理的syncronized Ajax 调用。

window.onbeforeunload = function(){
   $.ajax({
      url:      'somewhere',
      type:     'POST',
      dataType: 'text',
      async:    false,
      data:     'you_data_here',
      success:  function(data){
      }
   });
};

这样您应该能够将一些数据传输到您的服务器，而浏览器会阻止卸载。这有一些缺点。最明显的是，这可能不是很好的用户体验，具体取决于要传输多少数据以及需要多长时间。
另一个是这种方法在某些（旧）浏览器中不可用。

一个不错的选择可能是不时或在每次操作后自动保存您的数据。

【讨论】：

如果保存功能还没有被其他功能如此依赖，我很乐意将其更改为同步。我想如果那是唯一的方法，我应该考虑更改代码。

【解决方案2】：

      $(document).ready(function() {
             //below turns off popup on a tags, buttons, :input is for a submit in ie and img tags
             $("a").click(RemoveUnload);
             $("button").click(RemoveUnload);
             $(":input").click(RemoveUnload);
             $("img").click(RemoveUnload);
         });

       RemoveUnload(){window.onbeforeunload = null;}

【讨论】：