onpagehide、onunload 和 onpageshow、onload事件疑惑
今天在最新版本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事件疑惑的更多相关文章
- javascript--BOM的onload事件和onunload事件
1.onload事件 onload,页面加载后执行,所谓页面加载完成,指页面上所有的元素创建完毕,引用的所有的外部资源(js.css.图片)等下载完毕. 所以onload执行的比较晚,因为如果页面上有 ...
- 浏览器返回按钮不会触发onLoad事件
最近在做一个移动端项目,发现移动端某些返回和PC端是有差异的, 比如ios中返回按钮是直接使用缓存的, 不会执行任何js代码, 这个问题很蛋疼, 例如, 在提交的时候将按钮设置为loading状态, ...
- JavaScript 中 onload 事件绑定多个方法
当需要调用的方法较多时,我们可以进一步优化,编写一个专门用于绑定 onload事件的方法: function addLoadEvent(func) { //把现有的 window.onload 事件处 ...
- jQuery $(document).ready()和JavaScript onload事件
jQuery $(document).ready()和JavaScript onload事件 Why we need a right time? 对元素的操作和事件的绑定需要等待一个合适的时机,可以看 ...
- onload事件-----addLoadEvent函数
在给网页加一些特效时经常要在<body>中加入“onload”事件,即在网页加载完后执行某事件,例如:<body onload=”alert(‘欢迎光临!')”,但这样做有个大的缺陷 ...
- 共享onload事件
在做前端工作中,我们想要设置某个函数prepare,让它在网页加载完毕后执行,会触发一个onload事件,这个事件与windows对象相关联,必须把prepare函数绑定到这个时间上,语法如下:win ...
- javascript中onload事件如何绑定及执行顺序
onload事件,顾名思义就是为了js程序能够在网页加载成功过后进行执行.对于放在head里面的js来说,非常必要. 如何给网页绑定onload,主要有三种方式: window.onload=func ...
- jQuery的document ready与 onload事件——你真的思考过吗?
在进行实验和资料查询时,我遇到了几个关键问题: 1. window.onload到底是什么加载完触发? 2. body为什么会有onload事件? 3. 为什么是window.onload,而不是do ...
- 【HTML】Iframe中的onload事件
当iframe.src重新指定一个url时会重新执行iframe的onload事件 <iframe id="indexFrame" name="index" ...
随机推荐
- Django 探索(一) HelloWorld
一.Django怎么读 酱狗 二.Django下载 安装 下载地址 安装: tar zxvf Django-1.5.4.tar.gz python setup.py install 三.建立一个Hel ...
- 用SCMD2.0.8.0汉化版制作OB地图简易教程
[综合] [复制链接] Fenix_king 153 主题 0 好友 1万 积分 金星 该用户从未签到 星币 6392 水晶 0 星望 22 精华 0 发消息 电梯直达 楼主 ...
- js静态属性和静态方法
啥也不说了,直接上代码...(就是这么任性) var Animal = function(){}; Animal.name = "dog"; var a = ...
- ObjectiveC 文件操作二
10,文件委托,以便操作文件.头部看起来像是这样. @interface MyFileManager : NSObject @property(strong)NSFileManager *fileMa ...
- nyoj 21三个水杯(BFS + 栈)
题目链接: http://acm.nyist.net/JudgeOnline/problem.php?pid=21 思想: 看了一下搜索就来写了这题(BFS 找出最短路径 所以用此来进行搜索) 这题在 ...
- Android面试笔试集锦
前19题为常考题目 1. Android的四大组件是哪些,它们的作用? 答:Activity:Activity是Android程序与用户交互的窗口,是Android构造块中最基本的一种,它需要为保持各 ...
- hibernate-search-5.1.1简易使用
系统要求java7和hibernate-core-4.3.8,此外还依赖如下jar包 使用demo如下: package com.ciaos.controller; import java.io.IO ...
- Ordering Tasks(拓扑排序+dfs)
Ordering Tasks John has n tasks to do. Unfortunately, the tasks are not independent and the executio ...
- CSS3学习----选择器、字体
属性选择器: [att*=val]{}若att元素属性值包括val指定字符,则使用该样式 [att^=val]{}若att元素属性值开头字符为val,则使用该样式 [att&=val]{ ...
- 虎记:强大的nth-child(n)伪类选择器玩法
写在前面的戏: 最近参加了度娘前端IFE的春季班,刷任务,百度真是有营销头脑,让咱们这帮未来的技术狂人为他到处打广告(我可不去哪),其中做的几个任务中有几个以前没有用到的东西, 也算是有些许收获(现在 ...