ホームページ >ウェブフロントエンド >フロントエンドQ&A >jqueryでウィンドウを閉じるかどうかを判断する方法

jqueryでウィンドウを閉じるかどうかを判断する方法

PHPz
PHPzオリジナル
2023-04-07 09:03:44951ブラウズ

一部の Web サイトでは、Web ページを閉じるときに、データを保存するようユーザーに通知したり、Web ページ上でのユーザーの特定の操作を記録したりするなど、いくつかの操作を実行する必要がある場合があります。これらの操作は、ユーザーが Web ページを閉じるときに自動的にトリガーされる必要があり、jquery には、ウィンドウを閉じるイベントを判断するためのメソッドがいくつか用意されています。

1. beforeunload イベント

beforeunload イベントは、ウィンドウ、ドキュメント、またはフレームがアンロードされるか閉じられるときにトリガーされるイベントです。このイベントは、実際のアンインストールまたはシャットダウンの前にトリガーされます。このイベントではプロンプト ボックスがポップアップ表示され、ユーザーにデータの保存やその他の操作を促すことができます。

コードは次のとおりです:

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

このコードでは、beforeunload イベントが window オブジェクトにバインドされています。ユーザーがページを閉じるか、ページから離れると、プロンプト ボックスがポップアップ表示され、ページを離れてもよいかどうかをユーザーに尋ねます。ユーザーはウィンドウをそのままにするか閉じるかを選択できます。

2. アンロード イベント

アンロード イベントは、ウィンドウ、ドキュメント、またはフレームがアンロードされるか閉じられるときにトリガーされるイベントです。このイベントは、Web ページがアンロードされるか閉じられた後にトリガーされます。 Web ページ上のユーザーの特定の操作をこのイベントに記録できます。

コードは次のとおりです:

$(window).on('unload', function() {
   // 记录用户离开时间
   var leaveTime = new Date();
   localStorage.setItem('leaveTime', leaveTime.getTime());
});

このコードでは、アンロード イベントがウィンドウ オブジェクトにバインドされています。ユーザーがページを閉じるかページを離れると、ユーザーがページを離れた時間が記録され、localStorage に保存されます。

3. beforeunload イベントと unload イベントを同時に使用できます

コードは次のとおりです:

$(window).on('beforeunload', function() {
   // 提醒用户保存数据
   return 'Are you sure you want to leave?';
});
$(window).on('unload', function() {
   // 记录用户离开时间
   var leaveTime = new Date();
   localStorage.setItem('leaveTime', leaveTime.getTime());
});

このコードでは、beforeunload イベントと unload イベントがバインドされています同時に。ユーザーがページを閉じるか、ページから離れると、プロンプト ボックスがポップアップ表示され、ページを離れてもよいかどうかをユーザーに尋ねます。ユーザーはウィンドウに留まるか閉じるかを選択でき、ユーザーがページを離れた時刻が記録され、localStorage に保存されます。

概要

ユーザーがページを閉じるか、Web ページから離れたときに、Web ページ上で何らかの操作を行う必要がある場合は、beforeunload イベントと unload イベントを使用できます。このうち、beforeunload イベントは Web ページが実際に閉じられる前にトリガーされ、このイベントでプロンプト ボックスがポップアップ表示される場合と、unload イベントは Web ページが閉じられた後にトリガーされ、ユーザーの操作がこのイベントに記録される場合があります。同時に、これら 2 つのイベントを同時に使用して、複数の操作を実装できます。

以上がjqueryでウィンドウを閉じるかどうかを判断する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。