JS--JavaScript页面事件(页面初始化onload、页面卸载onunload)、beforeunload事件

页面初始化

load事件类型在页面完全加载完毕的时候触发。该事件包含所有的图形图像、外部文件(如CSS、JS文件等)的加载,也就是说,在页面所有内容全部加载之前,任何DOM操作都不会发生。为window对象绑定load事件类型的方法有两种:

1. 直接为window对象注册页面初始化事件处理函数:

window.onload = function(){
	alert("页面加载完毕");
}

2. 在页面< body >标签中定义onload事件处理属性:

<body onload="f()">
<script>
	function f(){
		alert("页面加载完毕");
	}
</script>

注意:如果同时使用上面两种方法定义页面初始化事件类型,它们并没有发生冲突,也不会出现两次触发事件。

JavaScript解释器在编译时,如果发现同时使用两种方法定义load事件类型,会使用window对象注册的事件处理函数覆盖掉body元素定义的页面初始化事件属性。

页面卸载

unload表示卸载的意思,这个事件在从当前浏览器窗口内移动文档的位置时触发,也就是说,通过超链接、前进或后退按钮等方式从一个页面跳转到其他页面,或者关闭浏览器窗口时触发。

window.onunload = f;
function f(){
	alert("888");
}

在unload事件类型中无法有效阻止默认行为,因为该事件结束后,页面将不复存在。由于在窗口关闭或离开页面之前只有很短的时间来执行时间处理函数,所以不建议使用该事件类型。使用该事件类型的最佳方式是取消该页面对象的引用。

beforeunload事件

beforeunload事件类型与unload事件类型功能相似,不过它更人性化,如果beforunload事件处理函数返回字符串信息,那么该字符串会显示一个确认对话框,询问用户是否离开当前页面。

示例:

window.onbeforeunload = function(e){
	return "您的数据还未保存!";
}

在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值