位置: 编程技术 - 正文

浅谈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)

  • 企业购进固定资产
  • 一般纳税人缴税
  • 外贸企业出口流程图
  • 交了9个点的工程增值税不可以抵扣吗
  • 进项税抵扣销项税怎么做账
  • 非居民企业股权转让所得税
  • 企业的主管部门承担什么责任
  • 咨询费发票怎么入账
  • 供应销用商品给的返利怎么做?
  • 亏损企业研发费加计扣除可以递延吗
  • 费用报销凭证是出纳的吗
  • 企业所得税营业税金及附加
  • 我公司开给对方13个点发票,后期我公司怎么抵税
  • 农产品税率2020
  • 河北省东光县是哪个城市
  • 其他综合收益的编码
  • 企业合并三种方式
  • 安置房账务处理
  • 增值税电子缴款凭证在哪里打印
  • 金税三期上线后的税收征管问题
  • w10系统程序停止运行
  • win11如何设置安装位置
  • 硬盘的转速有什么用
  • 出口免税和退税交附加税
  • php+jQuery+Ajax实现点赞效果的方法(附源码下载)
  • centos7完整版安装
  • 承接旅游业务
  • springbootssm
  • php编程获取音频信息
  • 基本户可以公对私吗
  • 基于个人同意处理个人信息的个人什么撤回其同意
  • 基于用户的协同过滤算法
  • 加计扣除内容
  • 信用减值损失需要纳税调整吗
  • 个人独资为什么不能叫公司
  • 财务报表不申报可以领票吗
  • 油票上没有公司名称可以报么
  • 委托代销受托方会计分录
  • 通讯补贴算福利费吗
  • 政府补助的相关法律法规
  • 固定制造费用属于固定成本吗
  • sql2008使用教程
  • 水利建设专项基金土增税清算能扣除吗
  • 现金日记账余额自动生成公式
  • 收到社保的退费是怎么回事
  • 增值税期末有留抵税额应该怎么结转
  • 借款收回的会计科目
  • 空调购买攻略
  • 公司购买的机票可以退吗
  • 主营业务成本账户属于什么账户
  • 印花税为什么不用计提
  • 管理费用费用占收入的多少
  • 超市卡发票可以作为费用吗
  • 应收账款的余额百分比
  • 收到进项发票不认证抵扣的会计分录
  • 登记生产成本和制造费用的明细账
  • 无法使用ie浏览器
  • 如何系统还原xp
  • archlinux 配置网络
  • msscli.exe - msscli是什么进程 有什么用
  • 分布式队列秒杀活动
  • linux网卡添加vlan
  • windows8网页版
  • python批量更改文件名称
  • javascript ()
  • nodejs搭建个人博客网站
  • js的定时器函数
  • node写自动化脚本
  • android 左右滑动 库
  • unity3d物理现象模拟
  • js easyui
  • 2、BluetoothChat之扫描设备DeviceListActivity.java
  • javascript面向对象吗
  • android 4.2
  • 社保扣缴客户端下载
  • 怎样查询灵活就业养老保险缴费记录
  • 海关进口增值税如何入账
  • 开票地税怎么算的
  • 汽车买保险车船税是什么意思
  • 小规模纳税人可以用专票抵扣税吗
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

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

    友情链接: 武汉网站建设