阻止window.onbeforeunload事件的弹出框或自定义弹出框

妈麻码骂

于 2022-05-24 16:33:26 发布

阅读量5k

点赞数

分类专栏： javascript 文章标签： javascript 前端开发语言 html

本文链接：https://blog.youkuaiyun.com/weixin_41420919/article/details/124949369

版权

javascript 专栏收录该内容

2 篇文章

订阅专栏

本文介绍了如何在使用window.onbeforeunload事件监听页面关闭时，避免浏览器默认的确认弹出框，同时实现自定义的关闭操作。通过调整事件处理函数，可以无弹出框或显示自定义弹出框，并调用自己的关闭方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

前引：网上很多关于window.onbeforeunload用来监听页面的意外退出或者关闭事件的用法但都会出现下面的弹出框。为此本博客提供方案使下面弹出框消失，但又能实现自己的相应业务功能。

在使用 window.onbeforeunload方法的时候会弹出以下的弹出框，但我们有时候的操作不想弹出这个弹出框或者自定义弹出框。这个时候我们就可以用下面的方法。

在这里插入图片描述
有弹出框：

    window.onbeforeunload= function (e) {
           debugger
            e = e || window.event;
            if (e) {
                e.returnValue = "";
                toCloseFun()//调用自己关闭的方法
            }

            return false;
        };

无弹出框/自定义弹出框

$(window).bind('beforeunload', function (event) {
            setTimeout(function () {
                /*var retVal = confirm("Do you want to continue ?");
                if (retVal == true) {
                    alert("User wants to continue!");
                    return true;
                }
                else {
                    window.stop();
                    return false;
                }*/
                toCloseFun()//调用自己关闭的方法
            });
            return;
        });