ページ終了前の JavaScript 確認

ユーザーが確認せずに誤ってページを離れることを防ぐために、JavaScript を使用して確認ウィンドウを実装できます。

onbeforeunload の使用

onbeforeunload イベントは、ユーザーがページを離れようとしているときに発生します。このイベント リスナーに配置されたコードは、ユーザーに確認ウィンドウを表示します。ユーザーが「OK」を選択すると、退出する意思が示されますが、「キャンセル」を選択すると退出プロセスが中断されます。ユーザーがページにとどまることを選択した場合、ユーザーをリダイレクトすることはできません。

window.onbeforeunload = function() {
  return 'Are you sure you want to leave?';
};

jQuery を使用する

jQuery は、beforeunload イベントを処理するための簡略化されたメソッドを提供します:

$(window).bind('beforeunload', function(){
  return 'Are you sure you want to leave?';
});

onunload の使用

onunload イベントはページがアンロードされる前のクリーンアップ タスクによく使用されますが、ユーザーをリダイレクトすることはできません。ただし、別れのメッセージや警告を表示する場合には依然として役立ちます。 Chrome 14 以降では、onunload.

window.onunload = function() {
    alert('Bye.');
}

jQuery の実装

$(window).unload(function(){
  alert('Bye.');
});