用户尝试退出浏览器时显示弹出窗口（GMail样式）

Question

当他/她试图退出浏览器窗口时，我必须提示用户。例如，当你去GMail并开始撰写新邮件，然后在保存任何内容之前尝试关闭它时，GMail会给你一个弹出窗口，例如：

  

你真的想退出这个页面吗？

然后你可以选择离开页面或留在页面上。所以我感兴趣的是当用户按下Stay on this page时他们是如何做到的以及他们使用了什么技巧（如果有的话）。

Answer 1

为了避免烦人的用户，您可能希望状态可以更改，具体取决于操作是否正在运行。像这样：

window.beforeunload = function(){
  if(isPerformingOperation) {
    return 'Are you sure you want to leave?';
  }
}

如果要提示，请将isPerformingOperation设置为true，并在完成后将其关闭。

Answer 2

将函数绑定到onbeforeunload。

window.onbeforeunload = function(){
  return 'Are you sure you want to leave?';
};

应该适用于所有浏览器（在IE 8，FF 3.6，Chrome 9中测试）。

或者使用jQuery：

$(window).bind('beforeunload', function(){
  return 'Are you sure you want to leave?';
});