1. ホーム
  2. javascript

[解決済み] ブラウザウィンドウのクローズイベントをキャプチャするには?

2022-04-26 06:47:57

質問

ブラウザのウィンドウやタブを閉じるイベントをキャプチャしたいのですが、どうすればよいですか? jQueryで以下を試しました。

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

しかし、それはフォームの送信時にも機能するので、私が望むものではありません。私は、ユーザーがウィンドウを閉じたときにのみトリガーされるイベントが欲しいのです。

どうすればいいですか?

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

jQueryのバージョンが1.7より古い場合は、こちらをお試しください。

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

live メソッドは submit イベントを使用するため、新しいフォームを追加する場合は、そのフォームにもハンドラをバインドする必要があります。

別のイベントハンドラで送信またはナビゲーションをキャンセルすると、後で実際にウィンドウが閉じられた場合、確認プロンプトが失われることに注意してください。 この場合、ウィンドウを閉じた時刻を submitclick イベントと beforeunload が数秒以上経ってから発生します。