onbeforeunload事件在页面关闭或刷新时触发

最新推荐文章于 2022-10-14 10:55:34 发布
最新推荐文章于 2022-10-14 10:55:34 发布
阅读量1k 收藏
点赞数
文章标签： javascript python ViewUI
原文链接：https://my.oschina.net/u/3803573/blog/2873627
版权

2019独角兽企业重金招聘Python工程师标准>>> hot3.png

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

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

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

有的网站解释是可以自定义一些提示消息(菜鸟教程),这个说法是错误的.该事件弹出的弹窗是浏览器的行为,无法更改
弹窗出来的内容只能是浏览器厂商提供的.除非有类似layer这样的插件能够改变弹窗的样式,不然没法自定义该弹窗的内容

转载于:https://my.oschina.net/u/3803573/blog/2873627

weixin_34407348
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
js - 页面刷新或关闭时发送ajax请求（onbeforeunload事件）
指尖上跳转
06-08 3448
onbeforeunload 事件 当窗口即将被卸载（关闭）时,会触发该事件.此时页面文档依然可见,且该事件的默认动作可以被取消。 事件创建 <body onbeforeunload="fun()"></body> window.onbeforeunload=function(){fun();}; window.addEventListener("beforeunload", fun); 案例 <!DOCTYPE html> <html> <head
javascript监听页面刷新或者离开的事件onbeforeunload
first_shun的博客
05-30 2911
一、onbeforeunload事件是干什么的 javascript在监听页面加载的时候有onload事件，是在页面加载完成之后出发的事件，而onbeforeunload事件就是在即将离开当前页面（刷新或关闭）时触发，用来监听页面刷新或者退出，该事件并且会弹出对话框提示用户是留在当前页面还是离开； 二、使用onbeforeunload事件 onbeforeunload事件的使用也特别简单 1、绑定在页面元素上，比如绑定在body上 <!DOCTYPE html> <html c
js实现用户离开页面前提示是否离开此页面的方法（包括浏览器按钮事件）
01-19
本文实例讲述了js实现用户离开页面前提示是否离开此页面的方法（包括浏览器按钮事件）。分享给大家供大家参考。具体如下： 用户离开页面前，提示是否离开此页面（包括浏览器按钮事件） [removed] [removed] = function(){ return 您的文章尚未保存！; } [removed] 如果在退出页面时需要弹出对话框，提示用户将要退出页面，类似当设置某个功能时而没有保存页面。这个实现的方法比较简单，最常见的就是使用unload事件，但这种实现有一个缺点，就是不管同意与否，结果还是一样，会退出页面，因此，
onbeforeunload 事件
恋&空的专栏
02-29 637
定义和用法 onbeforeunload 事件在即将离开当前页面（刷新或关闭）时触发。 该事件可用于弹出对话框，提示用户是继续浏览页面还是离开当前页面。 对话框默认的提示信息根据不同的浏览器有所不同，标准的信息类似 "确定要离开此页吗？"。该信息不能删除。 但你可以自定义一些消息提示与标准信息一起显示在对话框。 注意： 如果你没有在 元素上指定 onbeforeun
使用sessionStorage解决vuex在页面刷新后数据被清除的问题
01-21
1.原因 2.解决方法 localStorage没有时间期限，除非将它移除，sessionStorage即会话，当浏览器关闭时会话结束，有时间期限，具有自行百度 我这里使用sessionStorage，这里需要注意的是vuex中的变量是响应式的，而sessionStorage不是，当你改变vuex中的状态，组件会检测到改变，而sessionStorage就不会了，页面要重新刷新才可以看到改变，所以应让vuex中的状态从sessionStorage中得到，这样组件就可以响应式的变化 3.具体实现 应用背景是用户登入后保存状态，退出后移除状态 mutations.js ADD_LOGIN_U
[html] 页面刷新时sessionStroage会变（会清空）吗？
歌谣的博客
04-04 4591
[html] 页面刷新时sessionStroage会变（会清空）吗？ 不会 SessionStroage 是数据页面会话级别的, 当你在打开这个页面的时候会被创建, 并且重新加载或恢复页面仍会保持原来的页面会话... 当你在关闭对应浏览器Tab的时候会被清出 个人简介 我是歌谣，欢迎和大家一起交流前后端知识。放弃很容易， 但坚持一定很酷。欢迎大家一起讨论 主目录 与歌谣一起通关前端面试题 ...
indexeddb 大小_初窥浏览器数据存储 Cookie、Local Storage、Session Storage、IndexedDB、Web SQL...
weixin_39962675的博客
12-01 376
随着··· ···，废话就不多铺垫了，直接进入主题吧。浏览器有存储数据的需求，这两天查了下相关文档，重点学习了下。以谷歌浏览器 F12 调出控制台，主要有 Cookie、Local Storage、Session Storage、IndexedDB、Web SQL 几种方案，下面逐一简单说下。Cookie最早用于 HTTP 状态管理机制，Cookie 通常在 Web 应用程序中用于识别用...
sessionStorage的取值，存值，删除（用于浏览器存储客户端的访问数据）
a123789999的博客
12-29 2091
//sessionStorage作为HTML5的Web Storage的两种存储方式之一。 //用于本地存储一个会话（session）中的数据，这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据会被销毁。 //不是一种持久化的本地存储，会话级的存储。 //1，存值 sessionStorage['key']='value'; sessionStorage.setItem('key','value'); //2，取值 var v=sessionStorage['key']; var f=sessio
javascript离开页面时触发函数
PurineKing之博客
03-23 775
//绑定beforeunload事件 $(window).bind('beforeunload',function(){ return '您输入的内容尚未保存，确定离开此页面吗？'; }); //解除绑定，一般放在提交触发事件中 $(window).unbind('beforeunload'); ...
关闭浏览器时提示onbeforeunload事件
09-04
这个事件在用户关闭浏览器窗口、刷新页面、点击链接或者执行可能导致页面离开的操作时会被触发。 在上述代码示例中，`g_blnCheckUnload`变量被用来判断是否需要检查用户是否离开页面，如果需要检查，`...
javascript监听页面刷新和页面关闭事件方法详解
11-28
`onbeforeunload`事件在页面即将被卸载（刷新或关闭）时触发，它提供了一个机会让开发者执行一些必要的操作。这个事件通常用来显示确认对话框，询问用户是否真的要离开当前页面。例如： ```html <body ...
vue单页面实现当前页面刷新或跳转时提示保存
10-17
为此，我们还需要使用window.onbeforeunload事件来监听浏览器刷新或关闭事件。这个事件会在浏览器窗口即将卸载或刷新之前触发，可以用来提示用户是否有未保存的数据。 示例代码如下： ```javascript mounted() { ...
JS区分浏览器页面是刷新还是关闭
10-22
产品经理可能会提出更细致的需求，例如在页面关闭时和页面刷新时提供不同的提示信息，或者在页面刷新时需要有延时操作，比如在客服系统中，为了避免电话系统频繁签入签出导致的问题，可能会设置一个延时再让用户重新...
sessionStrorage保存、获取、清空等一些方法
Allanwhy的博客
04-30 5429
sessionStrorage保存、获取、清空等一些方法 1、存值 sessionStorage[‘key’]=‘value’; sessionStorage.setItem(‘key’,‘value’); 2、取值 var v=sessionStorage[‘key’]; var f=sessionStorage.getItem(‘key’); 3、删除 sessionStorage.remov...
解决Vue刷新后页面数据丢失的问题（sessionStorage和localStorage的用法）
Vivien_CC的博客
10-14 6635
其二，使用sessionStorage可以保证打开页面时sessionStorage的数据为空，而如果是localStorage则会读取上一次打开页面的数据。办法三：在父页面向后台请求远程数据，并且在页面刷新前将vuex的数据先保存至sessionStorage（以防请求数据量过大页面加载时拿不到返回的数据）state - 数据【存项目共享状态，是响应式的，store的数据改变，所有依赖此状态的组件会更新】，相当于全局变量，页面刷新的时候vuex里的数据会重新初始化，导致数据丢失。【页面关闭就没有了】
JavaScript离开页面事件
成长的记忆
07-28 1469
有时候一些网页，在用户刷新或
sessionStorage
yes_catherine的博客
08-13 772
sessionStorage 用于临时保存同一窗口(或标签页)的数据，在关闭窗口或标签页之后将会删除这些数据。 测试： 1 页面刷新后是否丢失 答案：不会 2 同一页面在不同tab页是否会相互影响 答案：不会 代码逻辑：每set一次sessionStorage中存储的数字加1 两个tab页完全不影响 ...
javascript离开当前页面就出发事件
梦想与激情同在
07-06 181
[code="html"] Confirm Before Leave javascript离开当前页面或刷新就出发事件 [/code]
如何使用和关闭onbeforeunload 默认的浏览器弹窗事件
最新发布
06-03
在浏览器中，当用户关闭当前页面或者刷新页面时，会出现一个默认的弹窗提示，询问用户是否确认离开此页面。这个弹窗是由 onbeforeunload 事件触发的。如果你想自定义这个弹窗，或者禁止这个弹窗出现，可以使用以下方法： 1. 自定义提示内容：可以通过在 onbeforeunload 事件中添加代码，来自定义弹窗的提示内容。例如： ``` window.onbeforeunload = function() { return '您确定要离开此页面吗？'; }; ``` 2. 禁止弹窗出现：可以在 onbeforeunload 事件中添加代码，返回 null 值来禁止弹窗出现。例如： ``` window.onbeforeunload = function() { return null; }; ``` 3. 恢复默认弹窗：如果你想恢复浏览器默认的弹窗提示，可以将 onbeforeunload 事件设置为 null。例如： ``` window.onbeforeunload = null; ``` 需要注意的是，自定义的提示内容和禁止弹窗出现的代码都可能会被浏览器的安全设置拦截，从而导致无效。在实际应用中，需要测试不同浏览器和版本的兼容性，以确保代码的可靠性。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值