位置: 编程技术 - 正文

浅谈javascript中onbeforeunload与onunload事件(js中onunload)

编辑:rootadmin

推荐整理分享浅谈javascript中onbeforeunload与onunload事件(js中onunload),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:js的onchange方法如何触发,javascript none,js中onchange啥意思,js中的onchange,js的onchange方法如何触发,js中的onload什么意思,js的onchange方法如何触发,javascript none,内容如对您有帮助,希望把文章链接给更多的朋友!

在最近的项目中,需要做到一个时间,就是用户离开页面的时候,我需要缓存页面其中一部分的内容,但是我不需要用户刷新的时候也缓存,我只希望在我用户离开的时候

执行这个函数。百度之,有onbeforeunload与onunload这两个事件,但是onbeforeunload在用户刷新的时候也会执行。搞得我弄的挺久的,所以想在这里做一个小小的总结

onbeforeunload与onunload事件

onbeforeunload定义和用法

onbeforeunload 事件在即将离开当前页面(刷新或关闭)时触发。

该事件可用于弹出对话框,提示用户是继续浏览页面还是离开当前页面。

对话框默认的提示信息根据不同的浏览器有所不同,标准的信息类似 "确定要离开此页吗?"。该信息不能删除。

但你可以自定义一些消息提示与标准信息一起显示在对话框。

注意: 如果你没有在 <body> 元素上指定 onbeforeunload 事件,则需要在 window 对象上添加事件,并使用 returnValue 属性创建自定义信息(查看以下语法实例)。

注意: 在 Firefox 浏览器中,只显示默认提醒信息(不显示自定义信息)。

使用方法:

或者:

事件触发的时候弹出一个有确定和取消的对话框,确定则离开页面,取消则继续待在本页。当然你可以自定义提示文本。

那么,当我只需要在我离开时执行这个函数,而刷新的时候不执行,那怎么做呢?

 这样,我离开页面时,可以执行我的缓存代码,而不弹出提示框,我刷新时也不弹出提示框,也不执行。值得一提的时,这个时候,要将ajax设置为同步,即:ajax里面的 async改为: false;

浅谈javascript中onbeforeunload与onunload事件(js中onunload)

浏览器兼容情况

IE、Chrome、Safari 完美支持

Firefox 不支持文字提醒信息

Opera 不支持

IE6,IE7 使用 onbeforeunload 遇到的bug

2、onunload定义和用法

onunload 事件在用户退出页面时发生。

使用方法和onbeforeunload类似

浏览器兼容情况

IE6,IE7,IE8 中 刷新页面、关闭浏览器之后、页面跳转之后都会执行;

IE9 刷新页面 会执行,页面跳转、关闭浏览器不能执行;

firefox(包括firefox3.6) 关闭标签之后、页面跳转之后、刷新页面之后能执行,但关闭浏览器不能执行;

Safari 刷新页面、页面跳转之后会执行,但关闭浏览器不能执行;

Opera、Chrome 任何情况都不执行。

总结

Onunload,onbeforeunload都是在刷新或关闭时调用,可以在<script>脚本中通过window.onunload来指定或者在<body>里指定。区别在于onbeforeunload在onunload之前执行,它还可以阻止onunload的执行。   Onbeforeunload也是在页面刷新或关闭时调用,Onbeforeunload是正要去服务器读取新的页面时调用,此时还没开始读取;而onunload则已经从服务器上读到了需要加载的新的页面,在即将替换掉当前页面时调用。Onunload是无法阻止页面的更新和关闭的。而 Onbeforeunload 可以做到。

页面加载时只执行onload 页面关闭时先执行onbeforeunload,最后onunload 页面刷新时先执行onbeforeunload,然后onunload,最后onload。

javascript中new关键字详解 和其他高级语言一样javascript中也有new关键字,我们以前认知的new是用来创建一个类的实例对象,但在js中万物皆是对象,为何还要new关键字呢,其实js中

javascript中的3种继承实现方法 使用Object.create实现类式继承下面是官网的一个例子//Shape-superclassfunctionShape(){this.x=0;this.y=0;}Shape.prototype.move=function(x,y){this.x+=x;this.y+=y;console.info("Shapemoved.

JavaScript中的this,call,apply使用及区别详解 学习起因:在之前的JavaScript学习中,this,call,apply总是让我感到迷惑,但是他们的运用又非常的广泛。遂专门花了一天,来弄懂JavaScript的this,call,apply。中

标签: js中onunload

本文链接地址:https://www.jiuchutong.com/biancheng/369960.html 转载请保留说明!

上一篇:JavaScript的代码编写格式规范指南(javascript的代码写在哪里)

下一篇:javascript中new关键字详解(js new option)

  • 契税的纳税人是指在我国境内转移房屋土地权的
  • 白酒消费税最低计税价格
  • 综合所得减除费用标准
  • 企业内部研发支出会计处理探讨
  • 汇票委托书会计分录
  • 申报个税大病医疗如何申报
  • 个人独资企业经营所得税税率表2023
  • 没有销售收入可以有销售费用吗
  • 上个月没有结账可以做下个月的账吗
  • 无发票材料可以入材料账吗
  • 暂估入库的材料领用时如何做账
  • 将外购货物分配给客户
  • 季度企业所得税计算方法举例
  • 股权转让的印花税是按照什么金额缴纳
  • 自来水企业应该交什么税
  • 高新企业减免所得税政策
  • 购金蝶软件记什么科目
  • 劳务分包发票税率是多少2020
  • 在建工程预转固后又有工程款
  • 免税销售额计入主营业务收入吗
  • 工会职工活动支出标准
  • 财管如何区分金额大小
  • 闲置设备怎么处理
  • linux系统中查看进程的命令
  • 股权转让协议的注意事项
  • i33240配什么主板
  • 房产税的计税依据的形式包括
  • 栖息在树林中
  • php处理数组的函数
  • 万字短文
  • python基本功
  • 移动端适配方案面试题
  • windows2022下载
  • timedatectl命令用法
  • 宝塔主机分销系统设计
  • 存货跌价准备确认损失
  • 资产处置损益怎么结转到本年利润
  • python 顺序
  • mac怎么下载postman
  • select
  • 企业未分配利润长期不分配
  • 公司向股东借的钱怎么还
  • 职工教育经费可以冲回吗
  • 不开票收入要交印花税吗
  • 企业法人股权转让要交什么税
  • 出租机械设备
  • 长期投资损失
  • 旅行社增值税2020
  • 应收账款计提减值准备会计处理
  • 总分公司如何承担责任
  • 结转已到期未兑现的商业承兑汇票会计分录
  • 怎么接收电子承兑汇票
  • 采用现销方式销售商品的会计分录
  • 管理费用怎么结转到本年利润未分配利润里了
  • 应收账款和应付账款属于什么科目
  • 固定资产改变用途折旧处理
  • 明细分类账的格式与登记方法
  • windows vista可以换7吗
  • centos 搜索
  • Linux VPS vsftp/proftpd FTP时间差八小时的解决方法
  • win7文件后缀名不全显示
  • windows8.1版本区别
  • bat怎么设置
  • perl getoption
  • 基于JAVASCRIPT实现的可视化工具是
  • 深入讲解MACD:MACD红绿柱
  • unity ugui教程
  • python目录文件拼接
  • 基于javascript的毕业设计
  • ADB not responding. You can wait more,or kill"abd.exe" process manually and click 'Restar
  • 深圳前海地铁站几号线
  • 国家税务总局12366纳税服务平台
  • 怎样在中国税务用手机交社保
  • 国税地税征管体制改革方案
  • 江苏个体户年报怎么填
  • 福建电子税务局登录入口
  • 如何挑选烟叶等级
  • 会计专业有必要读博士吗
  • 国际贸易争端的形式
  • 小微企业怎么报增值税
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设