如何在 JavaScript 中可靠地僅偵測瀏覽器視窗關閉事件？

瀏覽器視窗關閉事件：綜合指南

jQuery 提供了「beforeunload」事件來捕捉使用者嘗試離開頁面的時刻。網頁。然而，該事件不僅會在視窗關閉時觸發，還會在表單提交等操作時觸發。為了解決這個問題，讓我們深入研究一下捕獲瀏覽器視窗關閉事件的細節。

「beforeunload」事件，顧名思義，每當使用者離開目前頁面時就會觸發。這包括表單提交、連結點擊、關閉視窗或選項卡以及使用各種方式導航到新頁面。

為了說明這一點，請考慮以下jQuery 程式碼：

jQuery(window).bind(
    "beforeunload",
    function() {
        return confirm("Do you really want to close?")
    }
)

雖然此程式碼片段嘗試捕獲視窗關閉事件，它也會無意中觸發其他操作的確認對話框，例如表單提交。為了解決這個限制，我們需要區分視窗關閉和其他導航事件。

一種方法是利用以下jQuery 程式碼排除表單提交和超連結（排除其他框架中的提交和超連結）：

var inFormOrLink;
$('a').on('click', function() { inFormOrLink = true; });
$('form').on('submit', function() { inFormOrLink = true; });

$(window).on("beforeunload", function() {
    return inFormOrLink ? "Do you really want to close?" : null;
})

在此程式碼中，我們透過將相關操作的inFormOrLink 變數設定為true 來追蹤使用者目前是否正在與表單或連結互動。在「beforeunload」事件期間，只有當使用者目前不在表單或連結中時，我們才會顯示確認提示。

請注意，如果另一個事件處理程序取消提交或導航，此方法可能會遇到問題，從而可能阻止即使視窗關閉，也不會顯示確認提示。為了緩解這個問題，請考慮記錄提交和點擊事件的時間，並驗證「beforeunload」事件是否在幾秒鐘後發生。

以上是如何在 JavaScript 中可靠地僅偵測瀏覽器視窗關閉事件？的詳細內容。更多資訊請關注PHP中文網其他相關文章！