1. 程式人生 > 實用技巧 >js 瀏覽器視窗 重新整理、關閉事件

js 瀏覽器視窗 重新整理、關閉事件

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