📌  相关文章
📜  HTML | onbeforeunload 事件属性(1)

📅  最后修改于: 2023-12-03 15:01:14.446000             🧑  作者: Mango

HTML | onbeforeunload 事件属性

在 HTML 中，可以使用 onbeforeunload 事件属性来执行特定函数，当用户正在离开页面时触发。

语法
<body onbeforeunload="myFunction()">
  <!-- 页面内容 -->
</body>

或者

window.onbeforeunload = function() {
  myFunction();
};
参数

onbeforeunload 事件属性需要一个函数作为参数。该函数将在页面被卸载之前被调用。通常情况下，该函数用于执行某些清理逻辑或提示用户确认离开页面。

示例
<!DOCTYPE html>
<html>
<head>
	<title>onbeforeunload 事件属性示例</title>
</head>
<body onbeforeunload="myFunction()">
	<h1>欢迎来到我的网站！</h1>
	<p>请稍等，页面正在加载...</p>
	
	<script>
		function myFunction() {
  			alert('确定离开？');
		}
	</script>
</body>
</html>

当用户尝试关闭或离开当前页面时，将会提示“确定离开？”。 若用户点击“确定”则离开页面，否则留在当前页面。

注意事项
  • onbeforeunload 事件在页面被卸载之前触发，刷新页面也会触发。
  • onbeforeunload 事件通常用于询问用户是否确定离开页面，因此在事件函数内部应该包含类似“确定离开？”的提示。
  • 由于浏览器的安全机制，无法在 onbeforeunload 事件中修改页面内容。