Wie kann ich verhindern, dass Benutzer eine Webseite mit nicht gespeicherten Änderungen verlassen?

Verhindern nicht gespeicherter Änderungen

Beim Ändern von Daten auf einer Webseite möchte man häufig verhindern, dass Benutzer wegnavigieren, ohne sie zu speichern Änderungen. Dies kann mit dem window.onbeforeunload-Ereignis erreicht werden.

Implementierung

Legacy-Browser (IE6-8, Firefox 1-3.5)

1. Setze window.onbeforeunload zu einer Funktion, die eine Zeichenfolge zurückgibt:

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

   Nach dem Login kopieren

2. Entfernen Sie das Ereignis, um es zu deaktivieren:

   window.onbeforeunload = null;

   Nach dem Login kopieren

   Nach dem Login kopieren

Moderne Browser ( Chrome, Firefox usw.)

1. Aktivieren Sie die Eingabeaufforderung:

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

   Nach dem Login kopieren

2. Eingabeaufforderung deaktivieren:

   window.onbeforeunload = null;

   Nach dem Login kopieren

   Nach dem Login kopieren

Änderungen verfolgen

Um festzustellen, ob Änderungen vorgenommen wurden, verwenden Sie ein Validierungsframework oder Ihr eigenes benutzerdefiniertes Ereignis Handler.

jQuery-Beispiel:

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

Browserspezifische Überlegungen

• Nur ​​Chrome und Safari werden angezeigt generische Nachrichten und verhindern Sie benutzerdefinierte Nachrichten.
• Firefox-Eingabeaufforderungen nur bei der Formularübermittlung, nicht bei der URL Änderungen.

Das obige ist der detaillierte Inhalt vonWie kann ich verhindern, dass Benutzer eine Webseite mit nicht gespeicherten Änderungen verlassen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!