19

我们有一个管理门户,我们的老师经常忘记在注销和/或关闭浏览器窗口之前下载他们最新的 PDF 说明。我环顾四周,但找不到我要找的东西。

我想实现以下目标:

目标 1

在用户关闭浏览器窗口之前,系统会提示他们“您记得下载表单吗?” 有两个选项,是/否。如果是,关闭,如果不是,返回页面。

目标 2

在用户单击“注销”按钮之前,系统会提示他们与上述相同。

我第一次通过非常基本的代码(不适用于关闭浏览器)是:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>

<script type="text/javascript">
function init() {
    if (window.addEventListener) {
        window.addEventListener("beforeunload", unloadMess, false);
    } else if (window.onbeforeunload) {
        window.onbeforeunload = unloadMess;
    };
}

function unloadMess() {
    var User_Message = "[Your user message here]"
    return User_Message;
}
</script>
</head>

<body onload="init();">
     hello this is my site
</body>
</html>

编辑 - 新问题

下面提供的解决方案有效,但也有其自身的问题:

当用户单击链接以实际下载表单时,页面会认为他们正在尝试离开并反过来向他们显示错误消息!另外-我希望发生一个事件或另一个事件,但不一定同时发生。即,他们点击“注销”按钮,然后出现 OnClick 事件,然后是浏览器提示。有任何想法吗?

4

4 回答 4

32

2017 年更新

所有现代浏览器不再支持自定义消息。

window.onbeforeunload = function(evt) {
   return true;
}

这个用于关闭选项卡:

window.onbeforeunload = function(evt) {
    var message = 'Did you remember to download your form?';
    if (typeof evt == 'undefined') {
        evt = window.event;
    }
    if (evt) {
        evt.returnValue = message;
    }

    return message;
}

并使用onClick事件注销按钮:

onClick="return confirm('Did you remember to download your form?');"
于 2010-05-27T17:12:31.233 回答
2

我认为这可能是您问题的一部分:

else if(window.onbeforeunload) {
  window.onbeforeunload = unloadMess;
};

“if”语句中的测试只有在已经有处理函数的情况下才会为真。该测试并不意味着“窗口对象是否具有'onbeforeunload'属性?”。它的意思是,“当前窗口的 'onbeforeunload' 属性是否不为空?”。

我认为对于任何浏览器直接设置“onbeforeunload”是安全的。

于 2010-05-27T17:27:07.360 回答
1

您不能onbeforeunloadonclick. 这将使网站无法离开它。

但是,您可以只返回一个字符串,然后浏览器会显示一个确认对话框,其中包括您的字符串,询问用户是否真的想离开。

于 2010-05-27T17:53:11.370 回答
0

Pointy 对浏览器关闭事件的看法是正确的——想象一下,如果邪恶的网站可以阻止你关闭他们的窗口?因此,您无法阻止他们关闭您的网站,但您可以发出警报。

就您的注销按钮而言,这更直接:

<a href="logout.html" onClick="return confirm('Did you remember to download your form?');">Logout</a>
于 2010-05-27T17:16:21.873 回答