Comment puis-je empêcher les utilisateurs de quitter une page Web avec des modifications non enregistrées ?

Empêcher les modifications non enregistrées

Lors de la modification de données sur une page Web, il est courant de vouloir empêcher les utilisateurs de naviguer sans enregistrer leur changements. Ceci peut être réalisé en utilisant l'événement window.onbeforeunload.

Implementation

Navigateurs hérités (IE6-8, Firefox 1-3.5)

1. Ensemble window.onbeforeunload à une fonction renvoyant une chaîne :

   window.onbeforeunload = function() {
       return "Unsaved changes. Are you sure you want to leave?";
   };

   Copier après la connexion

2. Supprimez l'événement pour le désactiver :

   window.onbeforeunload = null;

   Copier après la connexion

   Copier après la connexion

Navigateurs modernes (Chrome, Firefox, etc.)

1. Activer l'invite :

   window.onbeforeunload = function() {
       return true;
   };

   Copier après la connexion

2. Désactiver l'invite :

   window.onbeforeunload = null;

   Copier après la connexion

   Copier après la connexion

Suivi Modifications

Pour déterminer si des modifications ont été apportées, utilisez un cadre de validation ou vos propres gestionnaires d'événements personnalisés.

Exemple jQuery :

$('input').change(function() {
    if ($(this).val() != "") {
        // Enable the prompt
        window.onbeforeunload = function() {
            return true;
        };
    }
});

Spécifique au navigateur Considérations

• Chrome et Safari affichent uniquement les messages génériques et empêchent les messages personnalisés.
• Firefox vous invite uniquement lors de la soumission du formulaire, pas lors des modifications d'URL.

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!