Javascript: Unload verhindern

Manchmal ist man in der Situation, dass man das verlassen einer Seite verhindern möchte. Meist in dem Fall wo man ein komplex Form aufgebaut hat und dem Benutzer eigentlich ersparen möchte, dass er die Seit unabsichtlich verlässt in dem er Back(Zurück) im Browser drückt.

Allerdings steckt darin auch ein kleines Problem: Spammer könnten diese Feature missbrauchen um einen dauerhaft auf der Seite zu halten. Also gab es lange Zeit nicht wirklich eine Lösung zu diesem Problem. Doch in Zeiten von Ajax & Co ist eine solche Funktion notwendig. Nur, dass sie halt etwas anders funktioniert, als man vermuten würde.

Anstatt ein eigenes Event dafür zu schaffen gibt es eine Art Zwischending. Dem Benutzer wird vom Browser eine Dialogbox präsentiert, welche ihn darauf hinweist, dass er dabei ist die Seite zu verlassen. Diese Meldung ist Standard vom Browser und kann nicht designet werden. Lediglich einen eigenen Zusatztext kann man angeben. Aber für unsere Zwecke reicht dies völlig!!! Wir können so den User daran erinnern, dass es vielleicht wertvolle Arbeit verlieren würden, wenn er nun die Seite verlässt. Und mehr wollen wir ja auch gar nicht.

Das schöne an der Sache ist, dass alle Navigation von der Seite weg dadurch abgefangen werden: Back, Close, Form-Post und neuen Link klicken! Wenn ich also etwas davon \“erlauben\“ möchte, dann muss ich den Hook vorher wieder entfernen.
Das Zauberwort heißt in diesem Fall onbeforeunload und ist kein wirkliches Event. Es muss über window.onbeforeunload eine Funktion gesetzt werden, welche eine Zeichenkette zurück gibt. Dieser String wird zusätzlich mit angezeigt. Wird window.onbeforeunload auf null gesetzt wird der Dialog wieder deaktiviert. Ich habe eine kleine Funktion geschrieben, welche mit true aktiviert werden kann und mit false deaktiviert.

Im Beispiel wird direkt beim Laden der Seite die Funktion aufgerufen, um so zu verhindern, dass der Benutzer die Seite verlassen kann, ohne eine Warnung zu bekommen. Man beachte, dass ich ein onclick beim Submit des Forms hinzugefügt habe, welches die preventUnload vor dem eigentlich Abschicken deaktiviert. Denn sonst kommt hier natürlich auch die entsprechende Meldung!

5 Antworten auf „Javascript: Unload verhindern“

  1. Pingback: anonymousBlogging
  2. Hallo Java Script Freunde,
    Würde mich für die kleine Funktion (window.onbeforeunload) interessieren, könnt Ihr mir vielleicht das Skript per E-Mail zukommen lassen!
    Gruß Joey

  3. Wir sind nun im Jahr 2014 angekommen.
    Beim FF v34 funktioniert das mit einer eigenen Message nicht mehr.
    Ein „unload“ „onunload“ „onbeforeunload“ ec. um damit wenigstens eine Funktion zu starten, ist bei diesem sehr beliebten Browser nicht möglich….
    Leider!

Kommentare sind geschlossen.