關閉瀏覽器事件 onbeforeunload和onunload


  在做畢設的時候,需要在關閉瀏覽器的時候向后台服務器修改用戶在線狀態。首先講一下 onbeforeunload 和 onunload(都是在刷新或關閉時調用) 的區別:

(1)onbeforeunload:在即將離開當前頁面(刷新或關閉)時觸發,即正要去服務器讀取新的頁面時調用,此時還沒開始讀取。該事件可用於彈出對話框,提示用戶是繼續瀏覽頁面還是離開當前頁面。兼容方面如下:

  • IE、Safari 完美支持
  • Firefox、Chrome 不支持文字提醒信息
  • Opera 不支持

(2)onunload:在用戶退出頁面時發生,即已經從服務器上讀到了需要加載的新的頁面,在即將替換掉當前頁面時調用。該事件可用於當用戶離開頁面時發生的事件(通過點擊一個連接,提交表單,關閉瀏覽器窗口等等。)。兼容方面如下:

  • IE瀏覽器 頁面跳轉刷新頁面能執行,但關閉瀏覽器不能執行;
  • firefox 頁面跳轉能執行,但刷新頁面、關閉瀏覽器不能執行;
  • Safari 刷新頁面、頁面跳轉,關閉瀏覽器都會執行;
  • Opera、Chrome任何情況都不執行。

  綜上所述,onunload是無法阻止頁面的更新和關閉的,而 onbeforeunload 可以做到。但注意的是請求需要同步,我覺得應該是采用異步方法,那么瀏覽器會在方法成功發送並響應前先unload,從而導致請求丟失。如果采用的是同步方法,瀏覽器就會等待請求成功,然后再unload。

  因為我項目的接口請求是用axios統一封裝代碼,而且沒找到方法讓axios的請求方法變成同步,所以我用了jQuery的ajax請求方法,代碼如下:


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM