首頁  >  文章  >  web前端  >  如何區分onUnload事件中頁面刷新和瀏覽器關閉?

如何區分onUnload事件中頁面刷新和瀏覽器關閉?

Patricia Arquette
Patricia Arquette原創
2024-11-04 03:51:29413瀏覽

How to Distinguish Between Page Refresh and Browser Close in the onUnload Event?

區分頁面刷新和瀏覽器關閉操作

當由頁面刷新或瀏覽器關閉觸發時,ONUNLOAD 事件在區分這兩個操作時提出了挑戰.

為了解決此問題,以下解決方案利用HTML5 本地儲存和客戶端/伺服器AJAX 通訊:

解決方案實作

頁面onLoad 事件處理程序

<code class="javascript">function myLoad(event) {
    if (window.localStorage) {
        var t0 = Number(window.localStorage['myUnloadEventFlag']);
        if (isNaN(t0)) t0=0;
        var t1=new Date().getTime();
        var duration=t1-t0;
        if (duration<10*1000) {
            // It's a browser reload
        } else {
            // It's a browser close
        }
    }
}</code>

Page onUnload 事件處理程序

<code class="javascript">function myUnload(event) {
    if (window.localStorage) {
        // Flag the page as unloading
        window.localStorage['myUnloadEventFlag']=new Date().getTime();
    }

    // Notify the server to disconnect the user in a few seconds
    askServerToDisconnectUserInAFewSeconds();
}</code>

伺服器實作

  • 收集清單中的斷線要求。
  • 設定一個計時器執行緒定期檢查列表,並超時(5 秒)後斷開使用者連線。
  • 收到客戶端的取消請求後,從清單中刪除斷開連線請求。

重點

  • 透過使用 unload 事件而不是 beforeUnload,可以正確處理附件。
  • 此解決方案僅限於支援 HTML5 本機儲存的瀏覽器。
  • 基於 event.clientY 或 X 位置的替代方法是不太可靠。

以上是如何區分onUnload事件中頁面刷新和瀏覽器關閉?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn