離開網站時彈出

Question

當訪問者離開網站詢問他們是否真的要離開時，有人要求我彈出一個窗口。 僅當其購物車中有商品時，此彈出窗口才會顯示。

我可以輕松地將彈出窗口限制在購物車中有物品的時候，但是我遇到的問題是，即使單擊內部鏈接也可以加載彈出窗口-我怎么擁有它，因此只有在實際離開網站時才會出現。

<script language="JavaScript">
  window.onbeforeunload = confirmExit;
  function confirmExit()
  {
    return "some message about leaving";
  }
</script>

Answer 1

好吧，首先：不要這樣做。 請。 對用戶而言，這是超級煩人的事情。 只需確保購物車中的商品存儲在服務器上或cookie中即可，這樣用戶就可以隨時返回該站點。

看着這個相關問題： 如何在javascript onbeforeunload事件中獲取目標URL？ 這不容易做到。

除了使用onbeforeunload ，還可以將點擊處理程序附加到顯示彈出窗口的網站上的外部鏈接，或者將點擊處理程序附加到檢查鏈接是否為外部的所有鏈接。

再次，不要這樣做...

Answer 2

如果單擊鏈接，它將在e.target.activeElement告訴您。 您可以檢查是否存在鏈接：

window.onbeforeunload = confirmExit;
function confirmExit(e)
{
    var $element = $(e.target.activeElement);
    if ($element.prop("tagName") !== "A") {
        return "some message about leaving";
    }
}

注意：您可以添加其他條件來檢查$element.attr("href") ，以確保它顯示的消息不是您的站點的鏈接。

Answer 3

您可以獲取單擊的鏈接項的URL，並檢查它是否在同一域中。 將其放入if語句中，並放入當前代碼。

Answer 4

您必須控制它以啟用和禁用行為，如下所示：

<script>
  var beforeunload = function (event) {
    var message = 'some message about leaving';

    (event || window.event).returnValue = message; // Gecko + IE
    return message;                                // Webkit, Safari, Chrome...
  };

  document.addEventListener('click', function(event) {
    if (event.target.tagName === 'A') {
      window.removeEventListener('beforeunload', beforeunload);
    }
  });

  window.addEventListener('beforeunload', beforeunload);
</script>

每當點擊頁面上的鏈接時，這將刪除beforeunload事件。

Answer 5

一種方式，一種方式，我也不建議您這樣做-用戶應該可以在不收到警告的情況下離開您的網站-但如果單擊了鏈接，則可以注銷該事件：

$('a').click(function() {
    window.onbeforeunload = null;
    return true; // continue
});