unloadおよびbeforeunloadイベントの詳細

ブラウザウィンドウが閉じられるか再読み込みされた時に発生するイベントがonunloadです。このイベントは、データベース接続を閉じる、ユーザーデータを保存するなどのクリーンアップ操作を行うために使用されます。このイベントが発生すると、ページのリソースとドキュメントは破棄されます。

ブラウザーのウィンドウが閉じるか更新される前に発生するonbeforeunloadイベントは、ユーザーに確認ダイアログを表示して現在のページを離れるかどうかを尋ねるために使用できます。ユーザーがページを離れることを選択した場合、ページは閉じられるか更新されます。

onbeforeunloadイベントでは、文字列を返すことで確認ダイアログのメッセージをカスタマイズすることができます。何も返さない場合、デフォルトのメッセージが表示されます。

例えば、

window.onbeforeunload = function() {
    return "确认离开当前页面吗？";
}

ユーザーがページを離れる場合、ページは閉じられるかリフレッシュされます。ユーザーがページに留まる場合、返される文字列は無視されます。

onbeforeunloadイベントの処理関数は、通常、関数の内部にイベントリスナーをバインドする必要があります。これにより、ブラウザがページを閉じたり更新したりする際に、返される文字列を無視しないようにします。例えば、

window.addEventListener("beforeunload", function(event) {
    event.preventDefault();
    event.returnValue = "确认离开当前页面吗？";
});

この例では、preventDefault（）メソッドはデフォルトの確認ダイアログを防ぐために使用され、returnValueプロパティはカスタム確認ダイアログのメッセージを定義するために使用されます。

要点是，onunload事件会在页面关闭或刷新时执行清理操作，而onbeforeunload事件会在页面关闭或刷新之前询问用户是否要离开当前页面。