JavaScript で onbeforeunload イベント ハンドラーを使用してページ ナビゲーションをインターセプトする方法

JavaScript でのページ ナビゲーションのインターセプト

ユーザーが特定の Web ページから移動することを防ぐことが重要なシナリオでは、JavaScript は、ナビゲーションプロセスを制御します。そのようなメソッドの 1 つは、onbeforeunload イベント ハンドラーです。

onbeforeunload イベント ハンドラー

onbeforeunload イベントは、ページがアンロードされる直前にトリガーされます。ページのアンロードが開始された後に発生する onunload イベントとは異なり、onbeforeunload では、ナビゲーション プロセスを中断する機会が与えられます。

onbeforeunload を実装する

ナビゲーションから離れてしまうのを防ぐには、 onbeforeunload を使用する Web ページの場合は、次の手順に従います。

1. onbeforeunload イベントのイベント リスナーを定義します。

<code class="javascript">window.onbeforeunload = function() {
  // ...
};</code>

2. イベント リスナー内で、非-ナビゲーションを防ぐための空の文字列。空の文字列が返された場合、ブラウザはデフォルトのメッセージを表示します。

例:

<code class="javascript">window.onbeforeunload = function() {
  return "";
};</code>

注: の場合古いブラウザでは、特定の文字列を返すことでナビゲーション確認プロンプトに表示されるメッセージをカスタマイズできます:

<code class="javascript">window.onbeforeunload = function() {
  return "Are you sure you want to navigate away?";
};</code>

onbeforeunload イベント ハンドラーを利用することで、ページ ナビゲーションを効果的にインターセプトし、ユーザーにページ ナビゲーションの確認またはキャンセルを促すことができます。現在の Web ページを離れる前のアクション。

以上がJavaScript で onbeforeunload イベント ハンドラーを使用してページ ナビゲーションをインターセプトする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。