如何实现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;

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

赞 (0)

相关推荐

  • ZeroClipboard插件实现多浏览器复制功能(支持firefox、chrome、ie6)

    但是值得注意的是官方介绍中已明确表态说这个插件不支持ie6,下面将提供多实例化Zero Clipboard复制功能的实现及兼容ie6的写法! 先下载ZeroClipboard http://www.jb51.net/jiaoben/24961.html <style type="text/css"> body { font-family:arial,sans-serif; font-size:9pt; } .copyit {text-align:center; border

  • C++获取多浏览器上网历史记录示例代码(支持获取IE/Chrome/FireFox)

    C++获取多浏览器上网历史记录示例代码(支持获取IE/Chrome/FireFox)

    复制代码 代码如下: // FileName: BrowsHistory.h // ------------------------------------------------------------------------------------------------------------------------// Remarks://   BrowsHistory对象应该设置成全局,或者静态:防止还没有获取完网址,对象就析构了:// ------------------------

  • chrome浏览器当表单自动填充时如何去除浏览器自动添加的默认样式

    chrome浏览器当表单自动填充时如何去除浏览器自动添加的默认样式

    一.发现该问题的原因-是在写账号登录页面时,input表单添加了背景图片,当自动填充,搓搓的一坨淡黄色背景出来. 这个原因是我草率的直接设置在input元素里面,结果问题就来了.所以如果把这个图标放在input表单外面,就不会出现这个问题. 二.表单自动填充会添加浏览器默认样式怎么处理和避免 第二张图,就是表单自动填充后,chrome会默认给自动填充的input表单加上input:-webkit-autofill私有属性 input:-webkit-autofill, textarea:-web

  • IE、FF、Chrome浏览器中的JS差异介绍

    因为浏览器公司各自为利益考虑,到目前为止各浏览器的HTML标准或是JS标准都还未统一.在平常的开发中,我们常使用的JS框架基本已经帮我们处理好了JS在各浏览器中的差异,但作为一个开发人员,还是有需要了解JS在浏览器中的差异. FF.Chrome:没有window.event对象 FF.Chrome:没有window.event对象,只有event对象,IE里只支持window.event,而其他主流浏览器两者都支持,所以一般写成:function handle(e){e = e || event

  • 在firefox和Chrome下关闭浏览器窗口无效的解决方法

    首先IE是可以通过window.close()来关闭浏览器窗口的,但是在firefox和Chrome下是无效的. 原因在于: Firefox下默认设置是无法通过脚本来关闭浏览器窗口的,为的是防止恶意脚本注入, 所以调整的方式就是在url地址栏中输入about:config, 然后在配置列表中找到 dom.allow_scripts_to_close_windows 点右键的选切换把上面的false修改为true即可. 默认是false chrome下的默认是不支持这种关闭方式的,但是也可以通过一

  • flex chrome浏览器调试出现空白的解决方法

    flex 4 在 chrome中调试时,空白,原因是谷歌有个默认的flash播放器,只要将默认的播放器禁用,留下新安装的插件,就OK了,只要在浏览器地址栏中,输入:"chrome://plugins/",会看到flash player有两个文件,点击查看详细,将chrome下面的关闭就ok了.

  • javascript判断chrome浏览器的方法

    通过userAgent判断检测一下userAgent返回的字符串里面是否包含"Chrome", 具体怎么检测是通过indexOf方法进行的. 复制代码 代码如下: <script type="text/javascript">    var isChrome = window.navigator.userAgent.indexOf("Chrome") !== -1;    alert(isChrome);    if (isChrom

  • js获得指定控件输入光标的坐标兼容IE,Chrome,火狐等多种主流浏览器

    直接上代码 复制代码 代码如下: var kingwolfofsky = { /** * 获取输入光标在页面中的坐标 * @param {HTMLElement} 输入框元素 * @return {Object} 返回left和top,bottom */ getInputPositon: function (elem) { if (document.selection) { //IE Support elem.focus(); var Sel = document.selection.creat

  • js代码判断浏览器种类IE、FF、Opera、Safari、chrome及版本

    因为ie10-ie11的版本问题,不再支持document.all判断,所以ie判断函数要重新写了 function isIE() { //ie? if (!!window.ActiveXObject || "ActiveXObject" in window) return true; else return false; } 第一种,只区分浏览器,不考虑版本 复制代码 代码如下: function myBrowser(){     var userAgent = navigator.

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

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

    一.避免弹出提示框 在网上搜了很多,答案大都是设置window.onbeforeunload=null ,但是试用之后无效. 这个问题放了两天之后返回来再次想,终于找到了答案,在此和大家分享一下: 解除jquery离开页面弹出提(1) 先解除绑定在设置弹出内容为null. 复制代码 代码如下: $(function(){   $(window).unbind('beforeunload');   window.onbeforeunload = null;   }) 二.其他相关[摘要] (1)w

  • js退弹 IE关闭时弹出广告代码,可以防止屏蔽

    在网上寻觅了很久JS退弹代码,也没有找出让人非常满意的代码.于是今天把收集的退弹代码做了一下整理,精简出一个非常短小精悍而强力的JS退弹代码,能够突破现在绝大多数浏览器的限制,包括SP2.IE6.IE7.遨游.MYIE等等. 现提供给有这方面需求的用户: 完整版24小时只弹一次的代码 复制代码 代码如下: function Get(){ var Then = new Date() Then.setTime(Then.getTime() + 24*60*60*1000) //这里是24小时,如果想

  • vue如何在用户要关闭当前网页时弹出提示的实现

    本文介绍了vue如何在用户要关闭当前网页时弹出提示的实现,分享给大家,具体如下: 效果如下图 正常 js 页面处理方式 window.onbeforeunload = function (e) { e = e || window.event; // 兼容IE8和Firefox 4之前的版本 if (e) { e.returnValue = '关闭提示'; } // Chrome, Safari, Firefox 4+, Opera 12+ , IE 9+ return '关闭提示'; }; vu

  • jQuery+css+html实现页面遮罩弹出框

    jQuery+css+html实现页面遮罩弹出框

    页面遮罩弹出框是最常见的一种情况,今天用jQuery实现页面遮罩弹出框,主要用的技术有JQuery,css和html, html代码如下: 复制代码 代码如下: <div id="main"><a href="javascript:showBg();">点击这里查看效果</a> <div id="fullbg"></div> <div id="dialog"&g

  • 关于python selenium 运行时弹出窗口问题

    关于python selenium 运行时弹出窗口问题

    近期在做一个网页代填项目时,用到了python的selenium,虽然实现了代填功能但是每次运行时都会弹出窗口,初始是python窗口,后续改进了又弹出了driver的窗口.在我看来是无伤大雅的,不过测试不接受,只能改,经过了各种尝试与搜索最后终算是较完美的解决了. 去除python窗口 项目初始是通过C++的process去调起python然后执行脚本的,后来发现会弹出python窗口. 使用的命令为 python.exe ie.py 效果如下 打开了页面但是同时会出现一个python窗口.

  • fckeditor粘贴Word时弹出窗口取消的方法

    本文实例讲述了fckeditor粘贴Word时弹出窗口取消的方法.分享给大家供大家参考.具体方法如下: 用fckeditor作为用户发布的编辑框,允许用户发布Word.默认的情况下,粘取进word时,提示是否清除word样式,选择"是"则弹出一个框,需要再粘贴一次来清除word样式.这个操作很麻烦,因此要取消. 开始找到的方法是把ckeditor/" target="_blank">fckeditoreditorjs下的fckeditorcode_i

  • JS实现刷新父页面不弹出提示框的方法

    本文实例讲述了JS实现刷新父页面不弹出提示框的方法.分享给大家供大家参考,具体如下: A页面 open方式出 B页面 ,当B页面做了类如保存动作后,需要关闭B页面,刷新A页面的情况下,会弹出一个提示框,要求点重试,这个就是发生预料之外的情况,用户体验很差. 解决方案分两种情况: 1.A页面很简单的情况(没有frame/iframe) 在B页面中的function中: function close(){ window.opener.location.reload(); window.opener

  • js兼容pc端浏览器并有多种弹出小提示的手机端浮层控件实例

    本文实例讲述了js兼容pc端浏览器并有多种弹出小提示的手机端浮层控件.分享给大家供大家参考.具体如下: 完整实例代码点击此处本站下载. 用法 <input type="button" id="btn_dialog" value="打开浮层"/> <div id="dialog-content" style="display:none;">这是内容</div> <sc

  • asp.net实现删除DataGrid的记录时弹出提示信息

    本文实例展示了asp.net实现删除DataGrid的记录时弹出提示信息的方法,在进行项目开发的时候非常实用,具体步骤如下: 1.在DataGrid中加一超链接按钮列,文本设为＂删除＂,在aspx页面中加上如下代码: <script language="JavaScript"> function delete_confirm(e){ if(event.srcElement.outerText=="删除"||event.srcElement.name==&

  • 解决bootstrap中使用modal加载kindeditor时弹出层文本框不能输入的问题

    废话不多说了直接给大家贴代码了,具体代码如下所示: $('#myModal').on('shown', function() { $(document).off('focusin.modal'); }); //显示modal $('#myModal').modal('show'); //show完毕前执行 $('#myModal').on('shown', function () { //加上下面这句!解决了~ $(document).off('focusin.modal'); // 打开Dia

随机推荐