Nara: ladende html abrechen oder stoppen

Beitrag lesen

Hallo!

Dein selbstgebauter Confirm-Dialog blockt die Browser-Navigation nicht. Die eingebaute Funktion confirm() z.B. würde das tun.

Beim Klick auf den Button/Link, der den Seitenwechsel auslöst, kannst du erst einmal mit JavaScript die Standardaktion unterdrücken. Dadurch verhinderst du schon einmal den Seitenwechsel.

Erst wenn der Nutzer »Ja, ich möchte die Seite verlassen« in deinem Confirm-Dialog auswählt, soll ja die Seite verlassen werden. Dazu ist es sinnvoll, beim Klick auf a-Elemente das Linkziel zu speichern.

Mit JavaScript kannst du Klicks auf a-Elemente (Links) im ganzen Dokument überwachen (Event-Handling). Beispiel:

// Variable die die Adresse des geklickten Links speichert

var targetURL;
// Überwache Klicks im Dokument an zentraler Stelle
var clickHandler = function(event) {
  // Prüfe, ob das angeklickte Element ein Link ist
  if (event.target.nodeName !== 'a') return;
  // Unterdrücke Standardaktion
  event.preventDefault();
  // Merke die Adresse des Links
  targetURL = event.target.href;
  // … Zeige Confirm-Dialog …
};
document.body.[link:http://@title=addEventListener]('click', clickHandler, false);


>   
> Im Confirm-Dialog kannst du nun mit targetURL arbeiten. Im Falle der Bestätigung kannst du zur neuen Seite weiterleiten:  
>   
> `[ref:self812;javascript/objekte/location.htm#href@title=location.href] = targetURL;`{:.language-javascript}  
>   
> Dieser Beispielcode ist ungetestet und soll das Prinzip verdeutlichen.  
>   
> [onbeforeunload](https://developer.mozilla.org/en-US/docs/Web/API/Window.onbeforeunload) ist eine weitere Möglichkeit, um einen browsereigenen Dialog beim Verlassen der Seite anzuzeigen. Das betrifft nicht nur Klicks auf Links, sondern alle Arten, wie man die Seite verlassen kann.  
>   
> Grüße,  
> Mathias  
  
  
Hallo  
  
Danke, Mathias das ist eine gute beispiel.  
  
an alle andere Sorry das ich nicht perfect auf deutsch schreiben kann, aber danke trotzdem :-)