onunload事件和onbeforeunload事件
记录知识点背景:在做一个h5项目时,在统计事件时有这样一个需求,
希望能统计到用户是从第几页离开的,用到了这个知识点。在此记录。
window.onunload
1.定义和用法
onunload事件在用户退出页面时发生。
onunload发生于当用户离开页面时发生的事件(通过点击一个链接,
提交表单,关闭浏览器窗口等等)。
注意:onunload事件同样触发了页面载入事件onload事件。
2.兼容性
IE,Firefox,和Safari支持onunload事件,但是Chrome或者Opera不支持该事件。
window.onboreunload与window.onunload的的相同点,都在刷新活关闭页面时调用。
onbeforeunload是正要去服务器读取新的页面时调用,此时还没开始读取。
onunload已经从服务器上读到了需要加载的新页面,在即将替换当前页面时调用。
onunload时无法阻止页面的更新和关闭,onbeforeunload可以做到。
onbeforeunload是在onunload之前执行,它还可以阻止onunload的执行。
参考文章:http://www.runoob.com/jsref/event-onunload.html
onunload事件和onbeforeunload事件的更多相关文章
- JS之onunload、onbeforeunload事件详解
简介 onunload,onbeforeunload都是在刷新或关闭时调用,可以在<script>脚本中通过 window.onunload来调用.区别在于onbeforeunload在o ...
- 160503、onunload、onbeforeunload事件详解
最近项目中做到一个功能:在上传页面用户开始上传文件之后用户点击任意跳转都需要弹出提示层进行二次确定才允许他进行跳转,这样做的目的是为了防止用户的错误操作导致这珍贵的UGC 流失(通常用户在一次上传不成 ...
- onunload、onbeforeunload事件详解--zhuan
最近项目中做到一个功能:在上传页面用户开始上传文件之后用户点击任意跳转都需要弹出提示层进行二次确定才允许他进行跳转,这样做的目的是为了防止用户的错误操作导致这珍贵的UGC 流失(通常用户在一次上传不成 ...
- onunload与onbeforeunload事件解析 标签: 浏览器 2017-04-10 09:46 45人阅读 评论(0)
注:只测试了chrome和IE浏览器的表现情况 onunload事件 //JS Document window.onunload = onunload_message; function onunlo ...
- 事件:卸载事件(onunload)
这是几点应卸载事件的说明 ①目前试了Firefox.Google Chrome.IE三个浏览器,该事件只对IE起作用. ②onunload事件对于刷新页面和超链接跳转其他页面情况有效,对于关闭页面无效 ...
- 各浏览器对 onbeforeunload 事件的支持与触发条件实现有差异
转载:http://www.w3help.org/zh-cn/causes/BX2047 标准参考 无. 问题描述 一般情况下,onbeforeunload 事件处理函数内会写入一些提示性语句,当用户 ...
- 学习框架/对象onbeforeunload事件
1.有没有发现在一些表单提交页面,当我们点击页面某个链接要离开表单提交页面时会弹出一个提示信息,如下: 那么,这是提示是怎么产生的呢?代码如下: window.onbeforeunload=funct ...
- javascript 的 事件类型(事件)
事件通常与函数配合使用,这样就可以通过发生的事件来驱动函数执行. 事件是文档或者浏览器窗口中发生的,特定的交互瞬间. 事件是用户或浏览器自身执行的某种动作,如click,load和mouseover都 ...
- jQuery事件和JavaScript事件
1.JavaScript事件: 属性 当以下情况发生时,出现此事件 FF N IE onabort 图像加载被中断 1 3 4 onblur 元素失去焦点 1 2 3 onchange 用户改变域的内 ...
随机推荐
- 蓝桥杯-算法训练--ALGO-6 安慰奶牛
问题描述Farmer John变得非常懒,他不想再继续维护供奶牛之间供通行的道路.道路被用来连接N个牧场,牧场被连续地编号为1到N.每一个牧场都是一个奶牛的家.FJ计划除去P条道路中尽可能多的道路,但 ...
- PHP小技巧
1.js获取服务器年月日 var date= '<?php echo date("Y-m-d",time())?>';//获取服务器年月
- 如何在工程中使用axis2部署webservice
有一个最简单的方法就是把axis2.war中的内容作为Web Project的基础, 来进行开发. 不过为了更清楚的了解如何在一个已有的Web Project中嵌入axis2, 那就手动来配置.大致分 ...
- QT制作窗口切换的小程序
前言:本次实验是在三个窗口之间自由切换,窗口中播放gif格式的动态图. 让我们先来看看使用到的主要的函数: 一.播放gif格式动态图的函数 QMovie *movie = new QMovie(&qu ...
- html5知识点:DOM编程
DOM是Document Object Model的缩写,中文名称是文档对象模型. DOM是处理HTML页面的标准编程接口,DOM可被JavaScript用来读取.改变HTML的内容和结构. 前端三大 ...
- Robotium 框架学习之Class By
Class By定义了页面元素的定位和支持哪些页面元素(至少我是这么理解的),使用及其简单:Used in conjunction with the web methods. Examples are ...
- Not found org.springframework.http.converter.json.MappingJacksonHttpMessageConverter
原因spring3跟spring4的jackson不一样. 解决方案: 1)spring3.x是org.springframework.http.converter.json.MappingJacks ...
- 机器学习(二)-kNN手写数字识别
一.kNN算法是机器学习的入门算法,其中不涉及训练,主要思想是计算待测点和参照点的距离,选取距离较近的参照点的类别作为待测点的的类别. 1,距离可以是欧式距离,夹角余弦距离等等. 2,k值不能选择太大 ...
- Python机器学习库和深度学习库总结
我们在Github上的贡献者和提交者之中检查了用Python语言进行机器学习的开源项目,并挑选出最受欢迎和最活跃的项目. 1. Scikit-learn(重点推荐) www.github.com/sc ...
- css实现左侧固定宽,右侧自适应的7中方法
一个面试会问的问题,如何实现两个盒子,左侧固定宽度,右侧自适应. 1.利用 calc 计算宽度的方法 css代码如下: .box{overflow: hidden;height: 100px;marg ...