当窗口,文档及其资源即将卸载时,将触发该事件。该文档仍然可见,此时事件仍可取消。
如果为
returnValue
Event属性分配了一个字符串,则会出现一个对话框,要求用户确认离开该页面(参见下面的示例)。IE浏览器在对话框中显示返回的字符串,但其他浏览器会显示自己的消息。如果未提供任何值,则以静默方式处理事件。
注意:为了防止不需要的弹出窗口,浏览器可能不会显示在beforeunload事件处理程序中创建的提示,除非页面已与之交互,甚至根本不显示它们。
PS:如果进入当前页面后没有用户没有与页面进行任何交互(比如鼠标在页面上点击),直接关掉或者刷新当前页面是没有弹窗提示。一定要与页面进行交互之后,才能在页面卸载的时候弹出确认离开的对话框;没有进行页面交互,也是会触发beforeunload事件的,只是不会弹出确认离开的对话框。
//通用
window.onbeforeunload = function (event) {};
//IE9+
window.addEventListener("beforeunload", function (event) {});
属性 | 类型 | 描述 |
---|---|---|
target 只读 | EventTarget | 事件目标(DOM树中最顶层的目标)。 |
type 只读 | DOMString | 事件的类型。 |
bubbles 只读 | Boolean | 事件通常会冒泡吗? |
cancelable 只读 | Boolean | 可以取消活动吗? |
returnValue[1] | DOMString | 事件的当前返回值(显示用户的消息)。 |
[1]为了防止网站欺骗用户,谷歌浏览器和火狐浏览器已经废弃设置returnValue
,谷歌浏览器和火狐浏览器弹窗只显示各自系统通用字符串,忽略自定义字符串,IE依然可以显示自定义字符串,Edge(IE12+)依然可以显示自定义字符串。
PS:不用再怀疑为什么设置了returnValue没有效果了。
Google声明:
window.onbeforeunload = function (event) {
event = event || window.event;
event.returnValue = "xxxxxxx";
};
window.addEventListener("beforeunload", function (event) {
event = event || window.event;
event.returnValue = "xxxxxxx";
});
window.addEventListener("beforeunload", function (event) {
event = event || window.event;
event.preventDefault();
});
onbeforeunload对话框用于现代Web上的两件事:
https://developer.mozilla.org/en-US/docs/Web/Events/beforeunload
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
发布者:全栈程序员栈长,转载请注明出处:https://javaforall.cn/201131.html原文链接:https://javaforall.cn