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


Posted in Javascript onMarch 05, 2015

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

一、避免弹出提示框

在网上搜了很多,答案大都是设置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 相关文章推荐
使用JS操作页面表格,元素的一些技巧
Feb 02 Javascript
10个基于浏览器的JavaScript调试工具分享
Feb 07 Javascript
JavaScript代码应该放在HTML代码哪个位置比较好?
Oct 16 Javascript
Javascript removeChild()删除节点及删除子节点的方法
Dec 27 Javascript
全面解析Bootstrap中scrollspy(滚动监听)的使用方法
Jun 06 Javascript
AngularGauge 属性解析详解
Sep 06 Javascript
分类解析jQuery选择器
Nov 23 Javascript
Bootstrap 响应式实用工具实例详解
Mar 29 Javascript
layer设置maxWidth及maxHeight解决方案
Jul 26 Javascript
jQuery提示框插件SweetAlert用法分析
Aug 05 jQuery
Node 代理访问的实现
Sep 19 Javascript
vue键盘事件点击事件加native操作
Jul 27 Javascript
深入理解JavaScript系列(18):面向对象编程之ECMAScript实现
Mar 05 #Javascript
基于zepto.js实现仿手机QQ空间的大图查看组件ImageView.js详解
Mar 05 #Javascript
基于jQuery实现网页进度显示插件
Mar 04 #Javascript
基于jQuery实现仿淘宝套餐选择插件
Mar 04 #Javascript
js实现类似于add(1)(2)(3)调用方式的方法
Mar 04 #Javascript
jquery 插件实现多行文本框[textarea]自动高度
Mar 04 #Javascript
JavaScript常用脚本汇总(三)
Mar 04 #Javascript
You might like
PHP环境搭建最新方法
2006/09/05 PHP
9个PHP开发常用功能函数小结
2011/07/15 PHP
推荐十款免费 WordPress 插件
2015/03/24 PHP
yii2学习教程之5种内置行为类详解
2017/08/03 PHP
yii2多图上传组件的使用教程
2018/05/10 PHP
js 动态选中下拉框
2009/11/26 Javascript
javascript 系统文件夹文件操作及参数介绍
2013/01/08 Javascript
Dojo Javascript 编程规范 规范自己的JavaScript书写
2014/10/26 Javascript
jQuery实现列表的全选功能
2015/03/18 Javascript
完美实现仿QQ空间评论回复特效
2015/05/06 Javascript
JavaScript实现动态删除列表框值的方法
2015/08/12 Javascript
两种简单的跨域方法(jsonp、php)
2017/01/02 Javascript
用Vue-cli搭建的项目中引入css报错的原因分析
2017/07/20 Javascript
vue2.0 + ele的循环表单及验证字段方法
2018/09/18 Javascript
使用Vue-cli 中为单独页面设置背景图片铺满全屏
2020/07/17 Javascript
深入理解 ES6中的 Reflect用法
2020/07/18 Javascript
Python模块学习 filecmp 文件比较
2012/08/27 Python
python实现随机密码字典生成器示例
2014/04/09 Python
python实现的一个p2p文件传输实例
2014/06/04 Python
python自动格式化json文件的方法
2015/03/11 Python
简单讲解Python中的字符串与字符串的输入输出
2016/03/13 Python
浅谈python数据类型及类型转换
2017/12/18 Python
Pandas标记删除重复记录的方法
2018/04/08 Python
PyCharm使用之配置SSH Interpreter的方法步骤
2019/12/26 Python
Django 实现 Websocket 广播、点对点发送消息的代码
2020/06/03 Python
python中append函数用法讲解
2020/12/11 Python
python 基于selenium实现鼠标拖拽功能
2020/12/24 Python
html5实现输入框fixed定位在屏幕最底部兼容性
2020/07/03 HTML / CSS
1688平价精选商城:阿里集团旗下,工厂出厂价格直销
2017/04/24 全球购物
学生思想表现的评语
2014/01/30 职场文书
品牌宣传方案
2014/03/21 职场文书
九九重阳节标语
2014/10/07 职场文书
责任书格式
2019/04/18 职场文书
四年级作文之植物
2019/09/20 职场文书
Windows下用Nginx配置https服务器及反向代理的问题
2021/09/25 Servers
Web应用开发TypeScript使用详解
2022/05/25 Javascript