如何擷取瀏覽器視窗關閉事件而不干擾表單提交？

在沒有表單幹擾的情況下捕獲瀏覽器視窗關閉事件

通常希望在瀏覽器視窗（或選項卡）關閉時專門觸發一個事件。然而，通常用於此目的的 beforeunload 事件也會對表單提交做出反應。我們如何排除與表單相關的操作觸發此事件？

答案：

每當使用者離開目前頁面時，無論出於何種原因，都會觸發 beforeunload 事件。這包括表單提交、連結點擊和直接導航到另一個頁面。要排除這些操作，我們可以利用以下程式碼：

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

或者，如果使用1.7 之前的jQuery 版本，建議使用以下程式碼：

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

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

在此解決方案中，當使用者點擊超連結或提交表單，則inFormOrLink 標誌設為true。在 beforeunload 事件期間，會檢查此標誌，如果為 false，則不會擷取該事件。

重要提示：

值得注意的是，其他事件處理程序可能會防止表單提交或導覽。在這種情況下，視窗關閉時 beforeunload 事件仍會觸發，導致確認提示遺失。為了緩解這種情況，請記錄點擊和提交事件的時間，並檢查 beforeunload 是否發生得晚得多，以便處理此類情況。

以上是如何擷取瀏覽器視窗關閉事件而不干擾表單提交？的詳細內容。更多資訊請關注PHP中文網其他相關文章！