onbeforeunload和onunload之間的區別

Question

onbeforeunload和onunload有什么區別？ 另外我有一個與它在iPad上的使用有關的具體問題...我有一個頁面（myPage.html），我試圖在頁面關閉時顯示警告（即按下X關閉iPad上的標簽）

現在我嘗試使用window.onunload和window.onbeforeunload以下是我在iPad上的調查結果;

1. 使用window.onunload，當用戶從myPage.html導航到不同的頁面時（通過點擊某些鏈接或在myPage.html上進行Google搜索），我能夠收到提醒。 但是，從最小化視圖（X）關閉選項卡時沒有任何反應

2. 使用window.onbeforeunload，即使用戶從myPage.html導航到不同的頁面，或者如果他從最小化視圖中關閉選項卡（X），我也不會收到警報。

我想知道是否有其他方法可以解決這個問題？

謝謝。

Answer 1

添加AlienWebguy的ans，以避免在支持這兩個事件的瀏覽器上進行雙重調用，

var onBeforeUnLoadEvent = false;

window.onunload = window.onbeforeunload= function(){
if(!onBeforeUnLoadEvent){
  onBeforeUnLoadEvent = true;
  //your code here
  }
};

Answer 2

onunload負責在頁面關閉時執行指令。 它還會導致IE和AJAX出現問題。

onbeforeunload更有效，因為它不會與實際關閉窗口競爭，並且在onunload之前觸發

我知道Opera曾經不承認onbeforeunload - 不確定他們是否已經修復了這個問題，但我總是注冊監聽器以確保安全：

window.onunload = window.onbeforeunload = (function(){...

Answer 3

onbeforeunload ：

• 在卸載開始之前調用
• MDN告訴我你可以使用event.preventDefault();取消關閉頁面event.preventDefault();
• 或者通過返回非空值（即值！= 0），頁面將彈出一個確認對話框，允許用戶選擇取消關閉
• MDN還表示Opera 12及其支持onbeforeunload - 看起來它支持它已經有一段時間了

onunload ：

• 卸載后調用已經開始，但在此之前的任何資源釋放（它不是很清楚，我究竟是什么在此期間完成）
• 此時取消關閉頁面為時已晚

我可以想到你為什么要在onbeforeunload上使用onunload的唯一原因是你的onunload代碼需要花費一些時間，並且不希望用戶在關閉時看到一個掛起的窗口。

Answer 4

onbeforeunload和onunload之間的一個顯着差異（除了可取消性）是前者是為下載鏈接觸發而后者不是。 示例： <a href="https://somewhere.com/thething.zip">download</a>將觸發onbeforeunload處理程序，但不會觸發onunload 。