molily: Bei Hostname Wechsel nen Confirm oder Alert ausgeben

Beitrag lesen

Hallo,

Das unload-Ereignis kannst du vergessen - damit kannst du zwar unter Umständen ein confirm-Fenster anzeigen, aber was auch immer der Benutzer dort wählt, du kannst nicht verhindern, dass die neue Adresse aufgerufen wird.

Schon besser ist das beforeunload-Ereignis. Damit kann man im Firefox und IE ein spezielles confirm-Fenster anzeigen. Wenn der Anwender dort Abbrechen wählt, wird wirklich der Seitenwechsel abgebrochen.

Aber du hast das immer noch das Problem, dass du in dem onbeforeunload-Handler nicht abfragen kannst, zu welcher Seite gerade gewechselt wird (meines Wissens).

Deshalb kannst du höchstens zentral alle Klicks auf Links (a-Elemente) abfangen und überprüfen, ob sie zu fremden Sites führen. Du musst dabei nicht jeden Link mit onclick ausstatten (und selbst das könntest du problemlos automatisieren). Click-Ereignisse steigen auf (Bubbling), sodass man sie zentral beim document-Objekt oder body-Element behandeln kann.

Schematisch:

document.onclick = handleClick;  
function handleClick (evt) {  
  // Zugriff auf das Ereignis-Objekt: Im IE über window.event, in anderen Browser über den Parameter evt  
  if (!evt) {  
    evt = window.event;  
  }  
  // Zugriff auf das Ursprungselement, bei dem der Klick passierte  
  var target;  
  if (evt.target) {  
    // W3C-konform  
    target = evt.target;  
  } else if (evt.srcElement) {  
    // MSIE  
    target = evt.srcElement;  
  }  
  // Handelt es sich beim auslösenden Element um einen Link?  
  if (target.tagName.toLowerCase() != "a")  
    return;  
  // Gibt es eine hostname-Eigenschaft?  
  if (!target.hostname)  
    return;  
  // Überprüfe, ob es sich um einen externen Link handelt  
  if (target.hostname != location.hostname) {  
    // Confirm-Abfrage  
    var ergebnis = window.confirm("Wollen Sie wirklich unsere Seite verlassen?");  
  }  
  // Wenn die Handler-Funktion false zurückgibt, wird die Standard-Behandlung des Klicks unterdrückt, sprich, das Linkziel wird nicht annavigiert  
  return ergebnis;  
}

(Kleines konzeptionelles Problem: Im Falle von <a><span>...</span></a> wird der Klick nicht korrekt als Klick auf ein a-Element erkannt, weil span das Ursprungselement ist, bei dem das click-Ereignis passierte. Man müsste dazu prüfen, ob das Ursprungselement in einem a-Element liegt.)

Generell wird dieses Vorgehen unter http://molily.de/css-position-fixed#javascript-alternative beschrieben - dort ist der Zweck ein etwas anderer, aber der Weg ziemlich ähnlich.

Das zentrale Vergeben von onclick-Handlern an bestimmte a-Elemente wird dort auch beschrieben: http://molily.de/css-position-fixed#javascript-kombination

Mathias