檢測瀏覽器/選項卡關閉

Question

我知道如果顯示警告給用戶，如果他們嘗試從當前頁面導航，詢問他們是否確實希望這樣做，但我想知道是否有方法顯示此警報僅在窗口/選項卡關閉時出現？ 我只想在窗口或標籤關閉時顯示確認信息，而不是在用戶單擊鏈接時顯示。

Answer 1

不可能。

唯一關閉的事件是onbeforeunload事件，但是在關閉的窗口/選項卡或導航到另一個頁面之間沒有區別（對於javascript）。

後續：

我想你可以點擊處理程序附加到每個錨在頁面上，並使用「髒」的標誌，但是這真的砍十歲上下。類似（原諒我，但使用jquery爲簡單起見）：

(function(){ 
    var closingWindow = true; 
    $('a').on('click', function(){ 
    if (this.href == /* on-domain link */){ 
     closingWindow = false; 
    } 
    }); 
    $(window).on('beforeunload',function(){ 
    if (closingWindow){ 
     // your alert 
    } 
    }); 
})(); 

但這就是儘可能靠近你會得到什麼。 注意：如果另一個javascript函數使用window.location等，這不會有所幫助。

Answer 2

您無法區分這兩者。

window.onbeforeunload被觸發之前的瀏覽器卸載它的資源。你不知道卸載的原因，只知道它是即將發生：

從MDN：

事件當窗口即將unload其資源火災。 該文件仍然可見，並且event is still cancelable。

Answer 3

如何做這樣的事情？

1. 有一個全局變量設置爲false（即var hasCLickedLink = false;）

2. 在所有的鏈接（<a>），附加一個事件處理程序，將變量設置爲true

3. 在onbeforeunload，檢查變量的值以查看鏈接是否已被點擊。如果它仍然是false，那麼他們沒有點擊鏈接，所以給他們警報。

Answer 4

您需要明確指定您不想顯示確認對話框的events。

var validNavigation = 0; 

function bindDOMEvents() { 
    // Attach the event keypress to exclude the F5 refresh 
    $(document).keydown(function(e) 
    { 
     var key = e.which || e.keyCode; 
     if (key == 116) 
     { 
      validNavigation = 1; 
     }; 
    }); 
    // Attach the event click for all links in the page 
    $("a").bind("click", function() 
    { 
     validNavigation = 1; 
    }); 
    // Attach the event submit for all forms in the page 
    $("form").bind("submit", function() 
    { 
     validNavigation = 1; 
    }); 
    // Attach the event click for all inputs in the page 
    $("input[type=submit]").bind("click", function() 
    { 
     validNavigation = 1; 
    }); 
}; 
$(document).ready(function() 
{ 
    bindDOMEvents(); 
    window.onbeforeunload = function() { 
     console.log(validNavigation); 
     if (validNavigation == '1') 
     { 
      console.log("No Alert.. Continue"); 
     } 
     else 
     { 
      return false; 
     } 
    }; 
});