使用onbeforeunload事件检测窗口是否刷新或关闭

2023-05-16

onunload,onbeforeunload 在页面刷新或关闭时调用,区别在于:

onbeforeunload 是在页面刷新或关闭前触发,这时浏览器并未请求服务器读取新页面,因此onbeforeunload是可以阻止页面更新或关闭的。

onunload 也是在页面刷新或关闭时触发,不过这时浏览器已经向服务器请求读取新页面,因此onunload是无法阻止页面更新或关闭的。

1. onbeforeunload 事件

事件触发时会弹出一个有确定和取消的对话框,确定后才会执行后续事件,否则继续留在本页。

触发于:

  • 关闭浏览器窗口 
  • 通过地址栏或收藏夹前往其他页面的时候 
  • 点击返回,前进,刷新,主页其中一个的时候 
  • 点击 一个前往其他页面的url连接的时候 
  • 调用以下任意一个事件的时候:click,document write,document open,document close,window close ,window navigate ,window NavigateAndFind,location replace,location reload,form submit. 
  • 当用window open打开一个页面,并把本页的window的名字传给要打开的页面的时候。 
  • 重新赋予location.href的值的时候。 
  • 通过input type=”submit”按钮提交一个具有指定action的表单的时候。 
可以用在以下元素:
  • BODY, FRAMESET, window
平台支持:IE,Firefox,Chrome,Safari。Opera暂不支持。

例子:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8">
  <title> 刷新与离开页面检测 </title>
 </head>

 <body>
  <script type="text/javascript">
  window.onbeforeunload = function(){
	return '你的文章尚未保存';
  }
  </script>
 </body>
</html>

2. onunload 事件

事件触发时,会弹出一个只有确定的对话框,点确定后执行后续事件。


触发于:

  • 关闭浏览器窗口 
  • 通过地址栏或收藏夹前往其他页面的时候 
  • 点击返回,前进,刷新,主页其中一个的时候 
  • 点击 一个前往其他页面的url连接的时候 
  • 调用以下任意一个事件的时候:click,document write,document open,document close,window close ,window navigate ,window NavigateAndFind,location replace,location reload,form submit. 
  • 当用window open打开一个页面,并把本页的window的名字传给要打开的页面的时候。 
  • 重新赋予location.href的值的时候。 
  • 通过input type=”submit”按钮提交一个具有指定action的表单的时候。 

平台支持:只有IE,其他都不支持。

例子:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8">
  <title> 刷新与离开页面检测 </title>
 </head>

 <body>
  <script type="text/javascript">
  window.onunload = function(){
	alert('谢谢下次再来');
  }
  </script>
 </body>
</html>

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

使用onbeforeunload事件检测窗口是否刷新或关闭 的相关文章

随机推荐

  • 端口被占用的原因及解决办法

    运行软件或者项目的时候 xff0c 出现以下问题 xff1a panic blademaster listen tcp 0 0 0 0 8080 listen tcp 0 0 0 0 8080 bind An attempt was mad
  • Rust 学习,与 node.js 交互

    1 背景 近期 xff0c 参与了一个活动 xff1a 学 Rust xff0c 免费拿树莓派 主要内容为开发应用 xff0c 在 node js 中调用 Rust 函数 实际上我认为在很多地方都能用上 Rust xff0c 鉴于活动要求
  • Zeal--一款支持207个离线文档的浏览器

    小编作为一个全栈工程师 xff0c 每个语言都会一点 xff0c 在写前端和后端的时候 xff0c 时长会打开好几个开发文档 xff0c 比如java css html 等 xff0c 有没有打开一个软件 xff0c 就能打开所有的帮助文档
  • Linux之间图像界面的传输 ssh -X username@{remote ip}

    之前用windows平台连接Linux平台 xff0c 总是通过Xshell 43 Xming来传输Linux系统的界面 现在在linux系统平台下 xff0c 通过ssh连接另一个Linux系统 xff0c 如何将远程Linux的图形界面
  • 利用图片Etag判断用户

    原理 xff1a 不使用Javascript xff0c SESSION xff0c COOKIES xff0c FLASH 利用图片Etag识别用户 1 根据用户的 REMOTE ADDR 与 HTTP USER AGENT 生成唯一Et
  • 音视频基础知识---封装格式介绍

    音视频基础知识汇总 xff1a 音视频基础知识 协议相关RTSP RTMP HLS 音视频基础知识 封装格式 音视频基础知识 视频编码格式 音视频基础知识 音频编码格式 音视频基础知识 像素格式RGB 音视频基础知识 像素格式YUV 1 什
  • php output_buffering 缓存使用

    buffer是一个内存地址空间 xff0c linux系统默认大小一般为4096 4kb 主要用于存储速度不同步的设备或优先级不同的设备之间传递数据的区域 通过buffer可以使进程之间的相互等待变少 例如 xff0c 当你打开一个文本编辑
  • 同一域名对应不同IP,访问指定主机文件内容的方法

    PHP获取远程主机文件内容方法很多 xff0c 例如 xff1a file get contents xff0c fopen 等 lt php echo file get contents 39 http demo fdipzone com
  • php 实现BigPipe分块输出

    原理 xff1a 利用 ob flush 与 flush 将缓冲区的内容提前输出 xff0c 浏览器可提早加载这部分的内容 xff0c 无需等待所有输出完成再加载 将页面内容划分为一个个小块 xff0c 输出一个后再输出下一个 xff0c
  • php 利用fsockopen GET/POST 提交表单及上传文件

    php 利用 fsockopen GET POST 提交表单及上传文件 1 GET get php lt php host 61 39 demo fdipzone com 39 port 61 80 errno 61 39 39 errst
  • php 过滤html标记属性类

    php 过滤html标记属性类 HtmlAttributeFilter class php lt php HTML Attribute Filter Date 2013 09 22 Author fdipzone ver 1 0 Func
  • php HTTP请求类,支持GET,POST,Multipart/form-data

    PHP HTTP请求类 xff0c 支持GET POST Multipart form data HttpRequest class php lt php HttpRequest class HTTP请求类 xff0c 支持GET POST
  • HTTP 204 与 205 应用

    HTTP 204 no content 表示响应执行成功 xff0c 但没有数据返回 xff0c 浏览器不用刷新 xff0c 不用导向新页面 HTTP 205 reset content 表示响应执行成功 xff0c 重置页面 xff08
  • apache mod_xsendfile 让php提供更快的文件下载

    服务器提供一个文件下载 xff0c 一般使用一个url指向服务器中的文件即可提供下载 但这样就不能进行统计 xff0c 权限检测等操作 因此 xff0c 一般使用php提供下载 xff0c 代码如下 xff1a lt php file 61
  • HTML5 使用application cache 接口实现离线数据缓存

    1 配置缓存文件 cache manifest MIME TYPE xff1a text cache manifest 文件名称 xff1a name appcache 作用 xff1a 用于配置需要缓存的文件 2 使用方法 在服务器上添加
  • XSS跨站测试代码大全

    XSS跨站测试代码大全 39 gt lt script gt alert document cookie lt script gt 61 39 gt lt script gt alert document cookie lt script
  • 范数、神秘值

    范数 格式 xff1a n 61 norm A p 功能 xff1a norm函数可计算几种不同类型的矩阵范数 依据p的不同可得到不同的范数 下面是Matlab中help norm 的解释 NORM Matrix or vector nor
  • anaconda3 安装(自用,记录用)

    提示 xff1a 文章写完后 xff0c 目录可以自动生成 xff0c 如何生成可参考右边的帮助文档 目录 前言 一 anaconda 卸载 二 anaconda3安装 1 Anaconda下载 2 Anaconda配置 三 Anacond
  • mysql 优化 insert 性能

    mysql 的 insert 语句语法 insert into 96 table 96 96 field1 96 96 field2 96 values 39 value1 39 39 value2 39 提高insert 性能的方法 1
  • 使用onbeforeunload事件检测窗口是否刷新或关闭

    onunload xff0c onbeforeunload 在页面刷新或关闭时调用 xff0c 区别在于 xff1a onbeforeunload 是在页面刷新或关闭前触发 xff0c 这时浏览器并未请求服务器读取新页面 xff0c 因此o