pageshow和pagehide事件
Firefox和opera有一个特性,往返缓存:可以在用户使用浏览器的后退和前进按钮时加快页面的转换速度,这个缓存不仅保存了页面的数据,还有DOM和JavaScript的状态。
为了更形象的说明bfcache的行为,Firefox提供了新事件:
虽然这些事件的目标是document,但是必须把事件处理程序添加到window上。
实例:
(function(EventUtil){
var showCount = 0;
EventUtil.addHandler(window, 'load', function(){
alert('Load fired');
});
EventUtil.addHandler(window, 'pageshow', function(event){
event = EventUtil.getEvent(event);
showCount++;
alert('Show has been fired '+showCount + ' times. '+event.persisted);
});
})(EventUtil)
pageshow定义和用法
onpageshow 事件在用户浏览网页时触发。
onpageshow 事件类似于 onload 事件,onload 事件在页面第一次加载时触发, onpageshow 事件在每次加载页面时触发,即 onload 事件在页面从浏览器缓存中读取时不触发。
为了查看页面是直接从服务器上载入还是从缓存中读取,你可以使用 PageTransitionEvent 对象的 persisted 属性来判断。 如果页面从浏览器的缓存中读取该属性返回 ture,否则返回 false
pagehide定义和用法
onpagehide 事件在用户离开网页时触发。
离开网页有多种方式。如点击一个链接,刷新页面,提交表单,关闭浏览器等。.
onpagehide 事件有时可以替代 onunload 事件,但 onunload 事件触发后无法缓存页面。
为了查看页面是直接从服务器上载入还是从缓存中读取,你可以使用 PageTransitionEvent 对象的 persisted 属性来判断。 如果页面从浏览器的缓存中读取该属性返回 ture,否则返回 false 。
不支持冒泡
指定了onunload事件的处理程序的页面会被自动排除在bfcache之外,即使事件处理程序是空的,原因在于:onunload最常用撤销onload中所执行的操作,而跳过onload后再次显示页面很可能就会导致页面不正常
pageshow和pagehide事件的更多相关文章
- 页面显示(pageshow)和页面隐藏(pagehide)事件
Firefox和Opera有一个新特性,名叫“往返缓存”(back-forward cache,或bfcache),可以在用户使用浏览器的“后退”和“前进”按钮时加快页面的转换速度.这个缓存中不仅保存 ...
- 监控页面后退前进,浏览器文档加载事件之pageshow、pagehide
https://www.cnblogs.com/milo-wjh/p/6811868.html http://www.runoob.com/jsref/event-onpageshow.html on ...
- HTML5事件-pageshow 和 pagehide
<!doctype html> <html> <head> <title>html5事件</title> <meta charset= ...
- 深入理解JavaScript 事件
本文总结自<JavaScript高级程序设计>以及自己平时的经验,针对较新浏览器以及 DOM3 级事件标准(2016年8月),对少部分内容作了更正,增加了各种例子及解析. 如无特殊说明,本 ...
- JavaScript事件总结
JavaScript 事件总结 本文总结自<JavaScript高级程序设计>以及自己平时的经验,针对较新浏览器以及 DOM3 级事件标准(2016年8月),对少部分内容作了更正,增加 ...
- JavaScript 事件总结
本文总结自<JavaScript高级程序设计>以及自己平时的经验,针对较新浏览器以及 DOM3 级事件标准(2016年8月),对少部分内容作了更正,增加了各种例子及解析. 如无特殊说明,本 ...
- 《JavaScript高级程序设计》笔记:事件(十三)
事件流 事件冒泡 IE的事件流叫做事件冒泡,即事件开始时由最具体的元素接收,然后逐级向上传播到较为不具体的节点(文档).如下代码: <body> <div id="myDi ...
- event 事件2
4.事件类型 “DOM3级事件”规定了一下几类事件: 1)UI事件(用户界面事件),当用户与页面元素交互时触发 2)焦点事件,当元素获得或失去焦点时触发 3)鼠标事件,当用户通过鼠标在页面上执行操作时 ...
- Javascript高级编程学习笔记(67)—— 事件(11)HTML5事件
DOM规范没有涵盖所有浏览器支持的所有事件 而许多浏览器出于满足用户需求,或解决特殊问题的目的,实现了一些自定义事件 HTML5列出了浏览器应该支持的所有事件,这里只讨论得到浏览器完善支持的事件(并非 ...
随机推荐
- fnb2b分支拉取注意事项
1. 大B分支拉取以后不要忘记把index.php中dev环境改为 $save_url = "http://dev-b2b.dev1.fn/"; 2. 大B分支拉取后,记得/bas ...
- Linux系统声卡问题
问题:Linux系统中有声卡设备,但是听不到声音 一.声卡驱动没有安装 1.通过插拔声卡查出声卡驱动 2.在相应的kernel中编译内核 修改保存.config文件,然后进行编译 make -j ma ...
- webpack(一) 安装使用
(一)webpack的安装 webpack是基于node.js,因此需要安装node.js. 安装好node.js 后,全局安装webpack,命令如下 npm install webpack -g ...
- hadoop fs 命令使用
参考:https://segmentfault.com/a/1190000002672666 命令基本格式: hadoop fs -cmd < args > 1.ls hadoop fs ...
- C语言常用关键字及运算符操作
1.关键字 (1)数据类型 char 1字节,8bit==256 int long,short unsgined ,signed 无符号为 ...
- jQuery 作业三个按钮
作业三个按钮 <!--声明 文档--> <!DOCTYPE html> <!--定义字符集--> <html lang="zh-CN"&g ...
- Fiddler抓包使用教程-安装配置
转载请标明出处:http://blog.csdn.net/zhaoyanjun6/article/details/72876628 本文出自[赵彦军的博客] Fiddler是什么? Fiddler是一 ...
- Java并发-volatile的原理及用法
Java并发-volatile的原理及用法 volatile属性:可见性.保证有序性.不保证原子性.一.volatile可见性 在Java的内存中所有的变量都存在主内存中,每个线程有单独CPU缓存内存 ...
- c# 软件绑定网卡mac的实用
一:网上搜c# 绑定网卡Mac 有好多信息,其中有篇分为几种方法获取mac 的方法,结果获得到的是一个list 队列的信息,信息获取到所有的物理网卡,无线网卡,蓝牙,隧道的网卡物理地址.对与软件绑定物 ...
- HDU 6126.Give out candies 最小割
Give out candies Time Limit: 6000/3000 MS (Java/Others) Memory Limit: 524288/524288 K (Java/Other ...