Comment inviter les utilisateurs à confirmer les modifications non enregistrées avant de quitter une page ?

Confirmation des modifications non enregistrées

Question : Comment afficher un message de confirmation lorsqu'un utilisateur quitte une page avec des modifications non enregistrées ?

Suivi Modifications :

Pour suivre les modifications, vous pouvez utiliser des écouteurs d'événements qui écoutent les modifications dans les champs de saisie ou d'autres éléments qui stockent des données. Lorsqu'une modification se produit, définissez un indicateur pour indiquer qu'il existe des modifications non enregistrées.

Affichage de la confirmation :

Pour afficher un message de confirmation, vous pouvez utiliser la fenêtre.onbeforeunload événement. Il se déclenche lorsque l'utilisateur tente de quitter la page. Dans ce gestionnaire d'événements, vérifiez s'il existe des modifications non enregistrées. S'il y en a, affichez un message de confirmation en utilisant confirm().

Exemple :

// 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.";
  }
};

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!