ページを離れる前に未保存の変更を確認するようユーザーに求めるにはどうすればよいですか?

未保存の変更の確認

質問: ユーザーが別のサイトに移動したときに確認メッセージを表示するにはどうすればよいですか?未保存のページ変更?

変更の追跡:

変更を追跡するには、入力フィールドまたはデータを保存するその他の要素の変更をリッスンするイベント リスナーを使用できます。変更が発生した場合、未保存の変更があることを示すフラグを設定します。

確認の表示:

確認メッセージを表示するには、window.onbeforeunload を使用できます。イベント。ユーザーがページから移動しようとするとトリガーされます。このイベント ハンドラーで、保存されていない変更があるかどうかを確認します。存在する場合は、confirm() を使用して確認メッセージを表示します。

例:

// Create a flag to track changes
var hasUnsavedChanges = false;

// Add an event listener to input fields
$('input').on('change', function() {
  hasUnsavedChanges = true;
});

// Create an event handler for window.onbeforeunload
window.onbeforeunload = function() {
  if (hasUnsavedChanges) {
    return "Are you sure you want to leave this page? You have unsaved changes.";
  }
};

以上がページを離れる前に未保存の変更を確認するようユーザーに求めるにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。