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" ...
随机推荐
- Dockerfile
http://blog.csdn.net/jiashiwen/article/details/48806243 一:如何使用: Dockerfile 用来创建一个自定义的image,包含了用户指定的软 ...
- 用WebBrowser实现HTML界面的应用和交互 good
这一篇将继续讨论在使用delphi进行普通应用程序开发的时候,WebBrowser的具体应用,主要是针对使用其进行HTML界面开发的,这也是一篇我在网上找到的资料,大家如要转载,请尊重原作者的知识产权 ...
- MySQL Binlog的介绍
binlog基本定义:二进制日志,也成为二进制日志,记录对数据发生或潜在发生更改的SQL语句,并以二进制的形式保存在磁盘中: 作用:MySQL的作用类似于Oracle的归档日志,可以用来查看数据库的变 ...
- HTML语法
2014-01-21/21:28:59 网页制作概述 HTML是WEB页面的描述性语言 CSS为HTML样式机制 JavaScript为交互WEB设计最佳选择 CSS\JavaScript\PHP都可 ...
- 最长回文子串 | 勇幸|Thinking
最长回文子串 | 勇幸|Thinking 最长回文子串
- ExpandableListView(一)替换系统默认的箭头
很多朋友可能在android开发中,用过ExpandableListView这个组件,这个组件功能强大,比传统的ListView有好多优势.然而在开发中,我相信有好多人,包括我个人都会遇到下面的一些问 ...
- Codeforces Round #242 (Div. 2) <A-D>
CF424 A. Squats 题目意思: 有n(n为偶数)个x和X,求最少的变换次数,使得X的个数为n/2,输出变换后的序列. 解题思路: 统计X的个数ans,和n/2比較,少了的话,须要把n/2- ...
- Android 之窗口小部件高级篇--App Widget 之 RemoteViews - 跨到对岸去
在之前的一篇博文( Android 之窗口小部件详解--App Widge t)中,已经介绍了App Widget的基本用法和简单实例.这篇主要讲解 App Widget 的高级内容,即通过 Remo ...
- 大夏VIEW使用技巧
HDXTextView *remark=[[HDXTextView alloc] initWithFrame:CGRectMake(leftmargin-5,labbackView.top, cell ...
- HTML,JAVASCRIPT代码美化demo
看见别人的博客里面的源码展示十分漂亮,一时兴起,就自己做了个. 当然,网上已经有别人做好的非常完善的codemirror.highlight.prettify.而我在写自己的这个小demo之前呢,也没 ...