Hes*_*ham 1 html javascript events dom-events
我在Chrome,FireFox和Safari上尝试了代码.仍然onbeforeunload不会发射.我也尝试了onunload,但它没有用.
这是我正在尝试的代码.
<!doctype html>
<html lang="en">
<head>
<title> Output to a Page </title>
<meta charset="utf-8">
<script>
window.onload = init;
window.onclick = clk;
window.onbeforeunload = closing;
function clk() {
window.alert("Ouch !!");
}
function closing() {
console.log("function alrt WORKS !!!!");
window.alert("closing now.....");
}
function init() {
var output = "";
for (var mms = 5; mms > 0; mms--) {
if (mms >= 3) {
output += "Still lots of M&Ms left, so eat more!<br>";
} else {
output += "Getting low on M&Ms, take it easy!<br>";
}
}
output += "All out of M&Ms";
var e = document.getElementById("output");
e.innerHTML = output;
}
</script>
</head>
<body>
<p id="output"></p>
</body>
</html>
bod*_*di0 17
onbeforeunload由于安全原因,该事件不可取消,但如果事件的事件处理函数onbeforeunload返回字符串值,则此文本将显示在确认对话框中,用户可在此确认是否要留下或离开当前页面.
请注意,事件侦听器无法onbeforeunload使用addEventListener和attachEvent方法注册事件(仅Safari和Google Chrome支持).对于跨浏览器解决方案,请在HTML中(使用元素的onbeforeunload属性body)或使用对象的onbeforeunload内联事件属性注册事件处理程序window.有关详细信息,请参阅以下示例
例子:
在HTML中:
<ELEMENT onbeforeunload="handler">
在JavaScript中:
object.onbeforeunload = handler;
object.addEventListener ("beforeunload", handler, useCapture);
调用onbeforeunload事件的操作:
window.navigate方法.window.open或document.open在同一窗口中打开文档的方法.尝试修改您的代码,如下所示:
window.onbeforeunload = closing;
/* other code here */
var closing = function () {
console.log("function alrt WORKS !!!!");
window.alert("closing now.....");
}
...或者直接将代码放在body标签中:
<body onbeforeunload="alert('function alrt WORKS !!!!')">
Mar*_*łek 17
Onbeforeunload 是网络开发者世界中最大的误解之一：D
1) 拒绝调用所有阻塞的原生函数（alert、prompt、confirm）。从用户的角度来看，这是显而易见的。
2）它（根据MDN）应该由“addEventListener”（MDN）注册
3) 只有当用户与站点有任何交互时才会触发它。没有任何交互（甚至在任何地方单击一下）事件 onbeforeunload 都不会被触发。
4) 本次活动的目的是，例如。代表用户秘密保存表单（或其他）中留下的数据（或记录用户行为等）。它不是为了阻止刷新站点！
因此没有办法（因为这将毫无意义）显示个性化信息。
唯一的感觉是在重新加载之前保存的数据时隐藏提示窗口。
5) 如果您想隐藏提示窗口，请不要为 event.returnValue 字段设置任何值。
此示例卸载站点（写入控制台文本“UNLOAD:1”）在刷新期间没有窗口提示。
window.addEventListener("beforeunload", function(event) {
console.log("UNLOAD:1");
//event.preventDefault();
//event.returnValue = null; //"Any text"; //true; //false;
//return null; //"Any text"; //true; //false;
});
此示例卸载站点（写入控制台文本“UNLOAD:1”）在刷新期间带有窗口提示。
window.addEventListener("beforeunload", function(event) {
console.log("UNLOAD:1");
//event.preventDefault();
event.returnValue = null; //"Any text"; //true; //false;
//return null; //"Any text"; //true; //false;
});
您可以对 event.returnValue 使用任何类型的值（如右侧所列）。这只是编码风格的问题。
event.preventDefault 和 return 都对这个事件没有影响（所以在你的代码中你可以省略那些注释行）。
在 Chrome、Edge、Firefox、Opera 上测试（23.09.2019 验证）。希望能帮助到你。
[编辑：]
为了避免因意外滑动/拖动屏幕（例如谷歌地图、图像和任何其他稳定内容）而重新加载移动应用程序，此 css 技巧非常有用：
身体 {
overscroll-behavior-y: 包含 !important;
}
该应用程序将是安全的，不会重新加载。
如果需要，可以考虑为用户提供另一种可能性（例如某些按钮）以重新加载。
| 归档时间： |
|
| 查看次数： |
28260 次 |
| 最近记录： |