有一些需要統計登出時間,或者用戶離開的時間點等需求,這種需要監聽用戶離開網頁,關閉網頁的事件。
pc端有 unload,beforeunload等事件 進行監聽
js代碼:

<body onunload="goodbye()"> //window window.onbeforeunload=function(e){ var e = window.event||e; e.returnValue=("確定離開當前頁面嗎?"); }
但是移動端並沒有關閉瀏覽器的x或者按鈕,移動端關閉瀏覽器,相當於殺死進程,來關閉,(安全因素)我們是無法監聽客戶端殺死進程的操作的。
以下這種方法,通用於pc+移動端,能較好地兼容;
通過監聽visibilityState的值來判斷,用戶是否離開了頁面 詳細介紹
測試機型:
window 谷歌 火狐
ios 微信瀏覽器,自帶瀏覽器,qq瀏覽器
小米手機 小米瀏覽器,微信瀏覽器,qq瀏覽器
均可使用。
<script> var p=document.createElement('p'); p.innerHTML='出去了' var p1=document.createElement('p'); p1.innerHTML='回來了' var body=document.getElementsByTagName('body')[0] document.addEventListener('visibilitychange', function () { // 用戶離開了當前頁面 if (document.visibilityState === 'hidden') { body.appendChild(p) } // 用戶打開或回到頁面 if (document.visibilityState === 'visible') { body.appendChild(p1) } }); </script>