如何实现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跨域访问示例(客户端/服务端)
May 19 Javascript
javascript事件冒泡和事件捕获详解
May 26 Javascript
Bootstrap模仿起筷首页效果
May 09 Javascript
js实现可键盘控制的简单抽奖程序
Jul 13 Javascript
详细谈谈javascript的对象
Jul 31 Javascript
AngularJs定制样式插入到ueditor中的问题小结
Aug 01 Javascript
JavaScript实现的CRC32函数示例
Nov 23 Javascript
关于JS与jQuery中的文档加载问题
Aug 22 jQuery
js定时器+简单的动画效果实例
Nov 10 Javascript
基于jQuery实现Ajax验证用户名是否可用实例
Mar 25 jQuery
5个你不知道的JavaScript字符串处理库(小结)
Jun 01 Javascript
JS中箭头函数与this的写法和理解
Jan 14 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
为Plesk PHP7启用Oracle OCI8扩展方法总结
2019/03/29 PHP
两种不同的方法实现js对checkbox进行全选和反选
2014/05/13 Javascript
基于NodeJS的前后端分离的思考与实践(四)安全问题解决方案
2014/09/26 NodeJs
js的toLowerCase方法用法实例
2015/01/27 Javascript
jquery左右全屏大尺寸多图滑动效果代码分享
2015/08/28 Javascript
jQuery实现的导航下拉菜单效果
2016/07/04 Javascript
浅谈JavaScript 覆盖原型以及更改原型
2016/08/31 Javascript
详解vue父子模版嵌套案例
2017/03/04 Javascript
JS利用cookies设置每隔24小时弹出框
2017/04/20 Javascript
jQuery使用ajax_动力节点Java学院整理
2017/07/05 jQuery
ubuntu编译nodejs所需的软件并安装
2017/09/12 NodeJs
jQuery获取随机颜色的实例代码
2018/05/21 jQuery
Angularjs中的$apply及优化使用详解
2018/07/02 Javascript
JavaScript+Canvas实现彩色图片转换成黑白图片的方法分析
2018/07/31 Javascript
JavaScript实现图片的放大缩小及拖拽功能示例
2019/05/14 Javascript
Vue 中使用富文本编译器wangEditor3的方法
2019/09/26 Javascript
vue input标签通用指令校验的实现
2019/11/05 Javascript
js 计数排序的实现示例(升级版)
2020/01/12 Javascript
Element InputNumber计数器的使用方法
2020/07/27 Javascript
详解Vite的新体验
2021/02/22 Javascript
使用python统计文件行数示例分享
2014/02/21 Python
python魔法方法-属性访问控制详解
2016/07/25 Python
Python学生信息管理系统修改版
2018/03/13 Python
Python解决走迷宫问题算法示例
2018/07/27 Python
Pytorch对Himmelblau函数的优化详解
2020/02/29 Python
Django框架models使用group by详解
2020/03/11 Python
django之从html页面表单获取输入的数据实例
2020/03/16 Python
在服务器上安装python3.8.2环境的教程详解
2020/04/26 Python
Python HTMLTestRunner库安装过程解析
2020/05/25 Python
HTML5实现的图片无限加载的瀑布流效果另带边框圆角阴影
2014/03/07 HTML / CSS
Vince官网:全球著名设计师品牌,休闲而优雅的服饰
2017/01/15 全球购物
EJB包括(SessionBean,EntityBean)说出他们的生命周期,及如何管理事务的
2015/07/24 面试题
2015年元旦主持词开场白
2014/12/14 职场文书
2015年教学管理工作总结
2015/05/20 职场文书
会计专业2019暑假实习报告
2019/06/21 职场文书
利用Java设置Word文本框中的文字旋转方向的实现方法
2021/06/28 Java/Android