JavaScript でブラウザ ウィンドウの終了イベントのみを確実に検出するにはどうすればよいですか?

ブラウザ ウィンドウの閉じるイベント: 総合ガイド

jQuery は、ユーザーがブラウザ ウィンドウを終了しようとした瞬間をキャプチャする「beforeunload」イベントを提供します。ウェブページ。ただし、このイベントはウィンドウの終了だけでなく、フォームの送信などのアクションでもトリガーされます。この問題に対処するために、ブラウザ ウィンドウの閉じるイベントのキャプチャの詳細を具体的に掘り下げてみましょう。

「beforeunload」イベントは、その名前が示すように、ユーザーが現在のページから移動するたびに発生します。これには、フォームの送信、リンクのクリック、ウィンドウやタブの閉じ、さまざまな手段を使用した新しいページへの移動が含まれます。

説明するには、次の jQuery コードを考えてみましょう。

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

これは、コード スニペットはウィンドウを閉じるイベントをキャプチャしようとしますが、フォームの送信など、他のアクションの確認ダイアログも誤ってトリガーしてしまいます。この制限に対処するには、ウィンドウの閉鎖と他のナビゲーション イベントを区別する必要があります。

1 つのアプローチでは、次の 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 中国語 Web サイトの他の関連記事を参照してください。