信息发布→ 登录 注册 退出

如何实现chrome浏览器关闭页面时弹出“确定要离开此面吗?”

发布时间:2026-01-11

点击量:

一、避免弹出提示框

在网上搜了很多,答案大都是设置window.onbeforeunload=null ,但是试用之后无效。

这个问题放了两天之后返回来再次想,终于找到了答案,在此和大家分享一下:

解除jquery离开页面弹出提(1) 先解除绑定在设置弹出内容为null。

复制代码 代码如下:
 $(function(){
   $(window).unbind('beforeunload');
   window.onbeforeunload = null;
  })

二、其他相关[摘要]

(1)window的onunload和onbeforeunload事件

以下是指在js中实现,而非 <body onunload="close()"> 这种方法!
因为这样是在unload掉body的时候触发,而无论任何浏览器,都会在关闭的时候unload掉body的!

模型1:

复制代码 代码如下:
 function close(){
 alert("this is a test");
 }
 window.onbeforeunload=close;

模型2:

复制代码 代码如下:
 function close(){
     if(document.body.clientWidth-event.clientX< 170&&event.clientY< 0||event.altKey)
     {
         alert("this is a test");
     } 
 }
 window.onbeforeunload=close;     

复制代码
关于模型1:
1).刷新,多窗口和单窗口都适合.
2).单窗口ie关闭整个ie触发.
3).ie7多窗口中关闭单页触发
4)其他多窗口刷新触发.关闭单个和关闭整个都不触发

对于模型2:
1).ie单窗口 和ie7多窗口,都要关闭整个浏览器才触发
2).其他多窗口浏览器刷新.关闭单页,关闭整个都不触发

 (2)创建离开提示框

绑定beforeunload事件

复制代码 代码如下:
 $(window).bind('beforeunload',function(){
     return '您输入的内容尚未保存,确定离开此页面吗?';
 });

解除绑定

复制代码 代码如下:
 $(window).unbind('beforeunload');
 window.onbeforeunload = null;

以上就是本文所述的全部内容了,希望大家能够喜欢。

标签:# 会在  # javascript判断chrome浏览器的方法  # Chrome扩展页面动态绑定JS事件提示错误  # Chrome开发者工具9个调试技巧详解  # 多窗口  # 绑定  # 都不  # 都是  # 是在  # 都要  # 在此  # 是指  # 禁止选中文字兼容IE、Chrome、FF等  # 这个问题  # 两天  # 希望大家  # 而非  # 大家分享  # 所述  # 此页面  # 找到了  # 在网上  # 这种方法  # safafi  # 关闭页面  # 弹出  # js代码判断浏览器种类IE、FF、Opera、Safari、chrome及版本  # 使用Chrome调试JavaScript的断点设置和调试技巧  # JavaScript无提示关闭窗口(兼容IE/Firefox/Chrome)  # 解决javascript:window.close()在chrome  # Firefox下失效的问题  # 完美兼容IE  # ff的设为首页、加入收藏及保存到桌面js代码  # JQuery自适应IFrame高度(支持嵌套 兼容IE  # ff  # chrome  # chrome)  # jQuery一步一步实现跨浏览器的可编辑表格  # 支持IE、Firefox、Safari、Chrome、Opera  # 兼容IE、FireFox、Chrome等浏览器的xml处理函数js代码  # jQuery旋转插件—rotate支持(ie/Firefox/SafariOpera/Chrome)  # chrome浏览器当表单自动填充时如何去除浏览器自动添加的默认样式  # js chrome浏览器判断代码  # json格式化/压缩工具 Chrome插件扩展版  # 解决ExtJS在chrome或火狐中正常显示在ie中不显示的浏览器兼容问题  # JavaScript获取鼠标坐标的函数(兼容IE、FireFox、Chrome)  
在线客服
服务热线

服务热线

4008888355

微信咨询
二维码
返回顶部
×二维码

截屏,微信识别二维码

打开微信

微信号已复制,请打开微信添加咨询详情!