JavaScriptがページを閉じないようにします

Web アプリケーション開発では、ユーザーが何らかのフォーム コンテンツを入力したり、何らかの操作を実行したり、特定のアプリケーション タスクを実行したりすることが非常に一般的な状況です。問題の 1 つは、ユーザーがブラウザまたはタブの閉じるボタンを誤ってクリックしてしまい、ページが閉じてしまい、ユーザーが誤ってそのページをクリックしてしまう可能性があることです。これを防ぐには、JavaScript コードを使用してブラウザ ウィンドウまたはタブが閉じないようにすることができます。この記事では、JavaScript コードを使用してページが閉じられないようにする方法を説明します。

1. onbeforeunload イベント
JavaScript では、onbeforeunload イベントを使用して、ブラウザ ウィンドウまたはタブが閉じないようにすることができます。 onbeforeunload イベントは、ブラウザーがウィンドウまたはタブを閉じるときにトリガーされるイベントで、ウィンドウまたはタブが閉じる前に発生します。このイベントハンドラをJavaScriptに登録することで、ユーザーの誤操作を防ぐことができます。

次は、onbeforeunload イベントの使用方法を示すサンプル コードです:

window.onbeforeunload = function() {
    return "您确定要离开吗？"; 
}

このサンプル コードでは、onbeforeunload イベント ハンドラーを登録し、確認メッセージ「よろしいですか?」を返します。離れる？" ？"。ユーザーがブラウザのウィンドウまたはタブを閉じようとすると、ブラウザはユーザーに本当にページを閉じたいかどうかを尋ねる確認メッセージを表示します。ユーザーが [キャンセル] ボタンを選択すると、ブラウザ ウィンドウまたはタブは閉じません。

2. onbeforeunload イベントをキャンセルする
onbeforeunload イベントをキャンセルしたい場合は、removeEventListener メソッドを使用できます。サンプル コードは次のとおりです。

window.removeEventListener("beforeunload", unloadEvent);

このサンプル コードでは、removeEventListener メソッドを使用して、onbeforeunload イベント unloadEvent のイベント ハンドラーを削除します。このようにして、ブラウザのウィンドウまたはタブを閉じるブロックを解除できます。

3. onbeforeunload イベントはサポートされていません
ただし、すべてのブラウザが onbeforeunload イベントをサポートしているわけではないことに注意してください。たとえば、イベントはモバイル デバイスでは利用できない場合があります。この場合、ユーザーがブラウザー ウィンドウまたはタブを閉じないようにするために試行できる回避策がいくつかあります。

別の方法は、ブラウザ通知を使用することです。たとえば、「終了すると保存されていない変更が失われます」などの情報を表示する通知またはタイトルを Web アプリケーションの上部に追加して、誤操作を避けるために変更を保存するようユーザーに思い出させます。

もう 1 つの方法は、CSS スタイルまたはその他の視覚効果を使用して、ユーザーが閉じるボタンにアクセスできないようにすることです。ただし、このアプローチでは、ユーザーが他の操作を実行できずにページに留まり、ユーザー エクスペリエンスが低下する可能性があります。

概要:
上記は、JavaScript コードを使用してブラウザ ウィンドウまたはタブが閉じないようにするいくつかの方法です。これらの方法では誤操作のリスクを完全に排除することはできませんが、誤ったシャットダウンの可能性を大幅に減らすことができます。実際の開発では、実際のニーズとブラウザのサポートに基づいて、ページ上でのユーザーの操作を保護する適切な方法を選択する必要があります。

以上がJavaScriptがページを閉じないようにしますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。