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

Posted

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了如何实现chrome浏览器关闭页面时弹出“确定要离开此面吗相关的知识，希望对你有一定的参考价值。

参考技术A

一、避免弹出提示框

解除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;

 参考技术B 撤销chrome禁止页面弹框的方法如下： 1、在chrome地址栏输入“chrome://settings/contentExceptions#popups”回车。如下图： 2、在“弹出式窗口例外情况”设置中，找到对应的被禁止的页面，将行为修改为“允许”即可。本回答被提问者采纳

jQuery插件--zTree中点击节点实现页面跳转时弹出两个页面的问题

　　这是第一次使用zTree，所以在使用之前我要先写一个demo来学习一下。我们要注意的是，zTree是一个jQuery插件，所以我们在导入zTree的js文件之前要先导入jQuery的js文件。

　　我们先下载zTree，点击我跳转到一个网站进行下载

　　代码直接贴出来

<!DOCTYPE html>
<html>

    <head>
        <meta charset="utf-8">
        <title></title>
        <link rel="stylesheet" type="text/css" href="css/zTreeStyle.css">
        <script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>
        <script type="text/javascript" src="js/jquery.ztree.all-3.1.min.js"></script>
    </head>

    <body>
        <div>
            <ul id="treeDemo" class="ztree"></ul>
        </div>
        <script type="text/javascript">
            var zTreeObj;
            // zTree 的参数配置，深入使用请参考 API 文档（setting 配置详解）
            var setting = {
                callback:{
                    onClick:function(event,treeId,treeNode){
                        if(treeNode.ahref){
                            window.open(treeNode.ahref);
                        }else{
                            alert("此节点没有链接！")
                        }
                        
                    }
                },
                view:{
                    showIcon:false
                }
            };
            // zTree 的数据属性，深入使用请参考 API 文档（zTreeNode 节点数据详解）
            var zNodes = [
            {
                name: "test1",
                open: true,
                children: [{name: "test1_1",ahref:"https://www.baidu.com/"}, {name: "test1_2"}]},
            {
                name: "test2",
                open: true,
                children: [{name: "test2_1"}, {name: "test2_2"}]
            }];
            $(document).ready(function() {
                zTreeObj = $.fn.zTree.init($("#treeDemo"), setting, zNodes);
            });
        </script>
    </body>

</html>

　　

 

　　之前我在点击test1_1这个节点的时候弹出了两个页面，这个原因是我在设置children节点的时候把里面的链接直接使用的是url属性，这样就会使得我在点击节点时弹出两个页面，然后我把属性名改为了ahref之后就可以了。url估计是一个关键字，我们在设置链接时不要使用url。

以上是关于如何实现chrome浏览器关闭页面时弹出“确定要离开此面吗的主要内容，如果未能解决你的问题，请参考以下文章

Vue | ElementUIVue离开当前页面时弹出确认框实现

单击按钮时弹出关闭并重定向到不同的页面！

怎么使js离开页面时弹出comfirm框？

怎样使用HTML实现当点击一个超链接时弹出一个新页面并自动生成一个页签？？？谢谢各位！！！！！！

如果在浏览器中禁用 javascript，如何在表单提交时弹出 javascript 和操作？ [复制]

webdriver 操作 Firefox 在关闭浏览器时弹出 “Plugin Container for Firefox已停止工作” 处理办法