js 浏览器窗口 刷新、关闭事件

时间:2024-02-19 19:32:56

1、beforeunload

当浏览器窗口关闭或者刷新时,会触发beforeunload事件。当前页面不会直接关闭,可以点击确定按钮关闭或刷新,也可以取消关闭或刷新。

2、onbeforeunload

当窗口即将被卸载(关闭)时,会触发该事件.此时页面文档依然可见,且该事件的默认动作可以被取消。

各大浏览器测试结果:

火狐浏览器
刷新时:先执行 onbeforeunload ,新页面即将替换旧页面时 onunload ,最后 onload ;
关闭时:只执行 onbeforeunload

谷歌浏览器
刷新时:先执行 onbeforeunload ,新页面即将替换旧页面时 onunload ,最后 onload ;
关闭时:先执行 onbeforeunload ,再执行 onunload.
小窗口关闭:先执行 onbeforeunload ,onunload

MicsoftEdge浏览器
刷新时:先执行 onbeforeunload ,新页面即将替换旧页面时 onunload ,最后 onload ;
关闭时:只执行 onbeforeunload

Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/70.0.3538.102 Safari/537.36 Edge/18.18362

IE浏览器
刷新时:先执行 onbeforeunload ,新页面即将替换旧页面时 onunload ,最后 onload ;
关闭时:只执行 onbeforeunload

360浏览器
刷新时:先执行 onbeforeunload ,再执行 onload ;
关闭时:只执行 onbeforeunload

window.onload = function(){
    console.log(\'unload操作===========================unload操作\');
    var userAgent = navigator.userAgent;
    var flag = userAgent.indexOf(\'Firefox\') > -1 ? true : false;
    window.onunload = function() {
        console.log(\'ooooooooooooooooo操作\');
        if(!flag){
            console.log(\'ooooooooooooooooo操作\');
        }else{

        }
    };

    window.onbeforeunload = function () {
        console.log(\'bbbbbbbbbbbbbbbbb操作\');
        if(flag){
            console.log(\'bbbbbbbbbbbbbbbbb操作\');
        }else{
            
        }
    };
}
View Code