檢測瀏覽器/選項卡關閉

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;
        }
    };
});

Answer 5

這個解決方案在帶有 Violentmonkey 的 Firefox 中對我有用。
它像大多數 window.onbeforeunload 一樣使用，並檢查是否按下了鼠標左鍵。 因此，如果按下，這意味着單擊可用空間或打開鏈接 - 而不是關閉選項卡。

    function DetectBrowserExit()
{
  if (butpres == 0)  {
   //your action before closing tab, alert not showing
  }
}

window.onbeforeunload = function(){ DetectBrowserExit(); }

// the key is pressed, then when window.onbeforeunload - link is opening, so, tab not closing 

        document.addEventListener('mousedown',function(e){
            if (e.which == 1) { //1-lbutton 2-mb 3-rb
                //e.preventDefault();
        butpres = 1
        setTimeout(function() {
          butpres = 0 //if after 3 seconds the script still works then the link has not been clicked, clear the click and continue to catch new clicks 

          //alert(butpres);
          }, 3000); //Two seconds will elapse and Code will execute.
         //alert(butpres);
                //command_lock();
            }
        },false);