今天在最新版本chrome浏览器中测试在什么情况下会触发onpagehide、onunload事件(点击一个链接,刷新页面,提交表单,关闭浏览器等)。测试代码粘贴如下:

<!DOCTYPE html>
<html lang='en'>
<head>
<title>测试</title>
<meta charset='utf-8'>
<script type="text/javascript">
function onpageshowfunc() {
alert("onpageshow()");
}
function onloadfunc() {
alert("onloadfunc()");
}
function onunloadfunc() {
console.log("2222222222");
alert("onunloadfunc()");
}
function onpagehidefunc() {
console.log("111111111");
alert("onpagehide()");
}
</script>
</head>
<body onunload="onunloadfunc()" onpagehide="onpagehidefunc()" onpageshow="onpageshowfunc()" onload="onloadfunc()" >
<a href="http://www.baidu.com">test link baidu</a>
</body>
</html>

结果意外发现:

1、onpagehide onunload事件是在销毁页面对象后触发的,onbeforeunload是在销毁页面对象前触发的 ,此时alert()方法已经被锁定销毁了,因而一直不能弹出提示框了,后来断点提示一个错误输出“Blocked alert('onpagehide()') during pagehide.”。“Blocked alert('onunloadfunc()') during unload.”

2、onpagehide比onunload先触发。

3、onload比onpageshow先触发。

以上仅自己结论,欢迎指正。

onpagehide、onunload 和 onpageshow、onload事件疑惑的更多相关文章

  1. javascript--BOM的onload事件和onunload事件

    1.onload事件 onload,页面加载后执行,所谓页面加载完成,指页面上所有的元素创建完毕,引用的所有的外部资源(js.css.图片)等下载完毕. 所以onload执行的比较晚,因为如果页面上有 ...

  2. 浏览器返回按钮不会触发onLoad事件

    最近在做一个移动端项目,发现移动端某些返回和PC端是有差异的, 比如ios中返回按钮是直接使用缓存的, 不会执行任何js代码, 这个问题很蛋疼, 例如, 在提交的时候将按钮设置为loading状态, ...

  3. JavaScript 中 onload 事件绑定多个方法

    当需要调用的方法较多时,我们可以进一步优化,编写一个专门用于绑定 onload事件的方法: function addLoadEvent(func) { //把现有的 window.onload 事件处 ...

  4. jQuery $(document).ready()和JavaScript onload事件

    jQuery $(document).ready()和JavaScript onload事件 Why we need a right time? 对元素的操作和事件的绑定需要等待一个合适的时机,可以看 ...

  5. onload事件-----addLoadEvent函数

    在给网页加一些特效时经常要在<body>中加入“onload”事件,即在网页加载完后执行某事件,例如:<body onload=”alert(‘欢迎光临!')”,但这样做有个大的缺陷 ...

  6. 共享onload事件

    在做前端工作中,我们想要设置某个函数prepare,让它在网页加载完毕后执行,会触发一个onload事件,这个事件与windows对象相关联,必须把prepare函数绑定到这个时间上,语法如下:win ...

  7. javascript中onload事件如何绑定及执行顺序

    onload事件,顾名思义就是为了js程序能够在网页加载成功过后进行执行.对于放在head里面的js来说,非常必要. 如何给网页绑定onload,主要有三种方式: window.onload=func ...

  8. jQuery的document ready与 onload事件——你真的思考过吗?

    在进行实验和资料查询时,我遇到了几个关键问题: 1. window.onload到底是什么加载完触发? 2. body为什么会有onload事件? 3. 为什么是window.onload,而不是do ...

  9. 【HTML】Iframe中的onload事件

    当iframe.src重新指定一个url时会重新执行iframe的onload事件 <iframe id="indexFrame" name="index" ...

随机推荐

  1. grunt打包过程中的注意点

    1.安装nodeJS   nodeJS下载地址: http://www.nodejs.org/download/ 2.   在Node.js command prompt 这个控制面板输入 npm i ...

  2. jquery不限图片焦点图

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. springmvc定时器

    用到的jar包: aopalliance-1.0.jar commons-logging-1.1.3.jar spring-aop-3.2.4.RELEASE.jar spring-beans-3.2 ...

  4. SQL Server 多表删除

    第一步: 建表 create table t1(x int, y int); create table t2(x int, y int); go insert into t1(x,y) values( ...

  5. 用rsync从Linux到Windows远程备份

    论 rsync是Linux系统下的数据镜像备份工具,从软件的命名上就可以看出来 了——remote sync.rsync支持大多数的类Unix系统,无论是Linux.Solaris还是BSD上都经过了 ...

  6. 给即将面临Noip的二班同学

    给即将面临Noip的二班同学: 我们共同走过了一年,在这里,真正认识彼此…… 失落过,但更多是欢笑…… 或许我们班的信息学竞赛承受着巨大的压力,但正因为这样,我们才学会了坚持:或许我们得不到他人的认可 ...

  7. 高性能JSON库---FastJson(阿里巴巴)

    1.FastJSON简单介绍 Fastjson是一个Java语言编写的高性能功能完好的JSON库. 它採用一种"假定有序高速匹配"的算法,把JSON Parse的性能提升到极致,是 ...

  8. android环境下解决java.io.IOException: Malformed ipv6异常的方法

    今天做客户端想服务端提交信息的时候,报出了如标题所显示的方法 方法以及参数如下: 输入的参数为:http://192.168.1.173:8080/Api/petinfo/petinfo?flag=a ...

  9. Android核心基础

    第三代移动通讯技术(3rd Generation) ,支持高速数据传输的蜂窝移动通讯技术.3G与2G的主要区别是传输数据的速度. 1987年,第一台模拟制式手机(1G)问世,只能进行语音通话,型号:摩 ...

  10. 【转载】设备坐标(窗口/window)和逻辑坐标(视口/viewport)

    一.预备知识 1.窗口是基于逻辑坐标的. 2.视口是基于设备坐标. 3.设备坐标是以像素为单位的,逻辑坐标是以.cm,m,mm,..... 4.系统最后一定要把逻辑坐标变为设备坐标. 5.设备坐标有3 ...