我需要在用户离开页面之前警告他们关于未保存的更改(这是一个非常常见的问题)。

window.onbeforeunload = handler

这是可行的,但它会引发一个默认对话框,其中包含一个烦人的标准消息,其中包装了我自己的文本。我需要完全替换标准消息,这样我的文本是清晰的,或者(甚至更好)用jQuery的模态对话框替换整个对话框。

到目前为止,我失败了,我还没有找到其他似乎有答案的人。这可能吗?

Javascript在我的页面:

<script type="text/javascript">   
    window.onbeforeunload = closeIt;
</script>

closeIt()函数:

function closeIt()
{
  if (changes == "true" || files == "true")
  {
      return "Here you can append a custom message to the default dialog.";
  }
}

使用jQuery和jqModal我已经尝试了这种事情(使用自定义确认对话框):

$(window).beforeunload(function () {
    confirm('new message: ' + this.href + ' !', this.href);
    return false;
});

这也不工作-我似乎不能绑定到beforeunload事件。


当前回答

我也遇到过同样的问题,我可以用自己的对话框来显示我的信息,但我面临的问题是: 1)它在所有导航上都给出了消息,我想它只用于近距离点击。 2)与我自己的确认消息,如果用户选择取消它仍然显示浏览器的默认对话框。

以下是我找到的解决方案代码,我写在我的主页上。

function closeMe(evt) {
    if (typeof evt == 'undefined') {
        evt = window.event; }
    if (evt && evt.clientX >= (window.event.screenX - 150) &&
        evt.clientY >= -150 && evt.clientY <= 0) {
        return "Do you want to log out of your current session?";
    }
}
window.onbeforeunload = closeMe;

其他回答

我也遇到过同样的问题,我可以用自己的对话框来显示我的信息,但我面临的问题是: 1)它在所有导航上都给出了消息,我想它只用于近距离点击。 2)与我自己的确认消息,如果用户选择取消它仍然显示浏览器的默认对话框。

以下是我找到的解决方案代码,我写在我的主页上。

function closeMe(evt) {
    if (typeof evt == 'undefined') {
        evt = window.event; }
    if (evt && evt.clientX >= (window.event.screenX - 150) &&
        evt.clientY >= -150 && evt.clientY <= 0) {
        return "Do you want to log out of your current session?";
    }
}
window.onbeforeunload = closeMe;

这不能在chrome现在做,以避免垃圾邮件,参考javascript onbeforeunload不显示自定义消息了解更多细节。

使用专用版本的“绑定”命令“一”。事件处理程序第一次执行后,将自动将其作为事件处理程序删除。

$(window).one("beforeunload", BeforeUnload);
 <script type="text/javascript">
        window.onbeforeunload = function(evt) {
            var message = 'Are you sure you want to leave?';
            if (typeof evt == 'undefined') {
                evt = window.event;
            }       
            if (evt) {
                evt.returnValue = message;
            }
            return message;
        } 
    </script>

参考http://www.codeprojectdownload.com

1)使用onbeforeunload,而不是onunload。

2)重要的是避免执行return语句。我这么说不是为了避免从你的联络人那里回来。你可以返回,但你要确保你到达了函数的结尾,并且不执行return语句。在这些条件下,不会出现内置的标准对话框。

3) You can, if you use onbeforeunload, run an ajax call in your unbeforeunload handler to tidy up on the server, but it must be a synchronous one, and you have to wait for and handle the reply in your onbeforeunload handler (still respecting condition (2) above). I do this and it works fine. If you do a synchronous ajax call, everything is held up until the response comes back. If you do an asynchronous one, thinking that you don't care about the reply from the server, the page unload continues and your ajax call is aborted by this process - including a remote script if it's running.