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?";
   };

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

   window.onbeforeunload = null;

Moderne Browser ( Chrome, Firefox usw.)

1. Aktivieren Sie die Eingabeaufforderung:

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

2. Eingabeaufforderung deaktivieren:

   window.onbeforeunload = null;

Ä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!