如何实现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 相关文章推荐
JQuery 学习笔记 element属性控制
Jul 23 Javascript
idTabs基于JQuery的根据URL参数选择Tab插件
Apr 11 Javascript
jquery如何把参数列严格转换成数组实现思路
Apr 01 Javascript
使用jquery的ajax需要注意的地方dataType的设置
Aug 12 Javascript
两种方法实现在HTML页面加载完毕后运行某个js
Jun 16 Javascript
原生JavaScript编写canvas版的连连看游戏
May 29 Javascript
JS监听微信、支付宝等移动app及浏览器的返回、后退、上一页按钮的事件方法
Aug 05 Javascript
Javascript实现图片懒加载插件的方法
Oct 20 Javascript
jQuery的事件预绑定
Dec 05 Javascript
JavaScript常用正则函数用法示例
Jan 23 Javascript
微信小程序  http请求封装详解及实例代码
Feb 15 Javascript
记一次react前端项目打包优化的方法
Mar 30 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 数组遍历顺序理解
2009/09/09 PHP
Windows中使用计划任务自动执行PHP程序实例
2014/05/09 PHP
PHP实践教程之过滤、验证、转义与密码详解
2017/07/24 PHP
PHP简单实现模拟登陆功能示例
2017/09/15 PHP
javascript中获取下个月一号,是星期几
2012/06/01 Javascript
关闭浏览器时提示onbeforeunload事件
2013/12/25 Javascript
JS对象转换为Jquery对象实现代码
2013/12/29 Javascript
深入理解JavaScript编程中的原型概念
2015/06/25 Javascript
javascript实现的简单的表单验证
2015/07/10 Javascript
node.js实现爬虫教程
2020/08/25 Javascript
JavaScript事件学习小结(一)事件流
2016/06/09 Javascript
总结javascript中的六种迭代器
2016/08/16 Javascript
详解jQuery中ajax.load()方法
2017/01/25 Javascript
jQuery实现表格奇偶行显示不同背景色 就这么简单
2017/03/13 Javascript
微信小程序 连续旋转动画(this.animation.rotate)详解
2017/04/07 Javascript
jquery写出PC端轮播图实例
2018/01/26 jQuery
Vue 全局loading组件实例详解
2018/05/29 Javascript
在vue-cli的组件模板里使用font-awesome的两种方法
2018/09/28 Javascript
35个最好用的Vue开源库(史上最全)
2019/01/03 Javascript
详解vuex持久化插件解决浏览器刷新数据消失问题
2019/04/15 Javascript
关于JSON解析的实现过程解析
2019/10/08 Javascript
解决vue项目中页面调用数据 在数据加载完毕之前出现undefined问题
2019/11/14 Javascript
JQuery省市联动效果实现过程详解
2020/05/08 jQuery
Vue 实现v-for循环的时候更改 class的样式名称
2020/07/17 Javascript
Element-ui el-tree新增和删除节点后如何刷新tree的实例
2020/08/31 Javascript
基于Vue+Webpack拆分路由文件实现管理
2020/11/16 Javascript
linux查找当前python解释器的位置方法
2019/02/20 Python
使用sublime text3搭建Python编辑环境的实现
2021/01/12 Python
GEOX鞋美国官方网站:意大利会呼吸的鞋
2017/07/12 全球购物
应届毕业生如何写求职信
2014/02/16 职场文书
工程采购员岗位职责
2014/03/09 职场文书
中层干部培训方案
2014/06/16 职场文书
领导班子四风对照检查材料
2014/09/23 职场文书
2014年药剂科工作总结
2014/11/26 职场文书
教师思想工作总结2015
2015/05/13 职场文书
springboot为异步任务规划自定义线程池的实现
2022/06/14 Java/Android