Hauptmenü

Untermenü

JavaScript - Objektreferenz - event

1. Das Objekt

Mit event können Maus- oder Tastatureingaben abgefangen werden. Damit lässt sich eine komplette Ereignisüberwachung programmieren, die sich aber von den eigentlichen Event-Handlern unterscheidet. Dieses Objekt kennt nur Eigenschaften.

Leider ist die Implementierung in den verschiedenen Browsern mal wieder völlig unterschiedlich. Wie könnt es auch anders sein. So benötigt der Internet Explorer (wer auch sonst) einen Verweis auf das Ereignis. Daher braucht der immer eine entsprechende Anweisung wie variable = event.Eventart. Bei den anderen Browsern wird das Ereignis übermittelt und steht einer Funktion als Parameter zur Verfügung.

2. Eigenschaften

clientX, clientY

Firefox Opera Safari Google Chrome Internet Explorer

Speichert die horizontale und vertikale Position des Mauszeigers relativ zur linken oberen Ecke des aktuellen Fensters.


function getHorz (evt)
{
  // Internet Explorer
  if (!evt)
  {
    leftposi = event.clientX;
  }
  // der Rest
  else
  {
    leftposi = evt.clientX;
  }
  alert (leftposi);
}
document.onclick = getHorz;

offsetX, offsetY

Opera Safari Google Chrome Internet Explorer

Speichert die horizontale und vertikale Position des Mauszeigers relativ zur linken oberen Ecke des auslösenden Elements. Diese Syntax ist zwar Microsoft-spezifisch, wird aber auch von anderen Browsern verstanden.


alert (window.event.offsetX)

pageX, pageY

Firefox Opera Safari Google Chrome Internet Explorer

(Internet Explorer ab Version 9)

Speichert die horizontale und vertikale Position des Mauszeigers relativ zur linken oberen Ecke des auslösenden Elements. Diese Syntax ist Netscape-/Mozilla-spezifisch.


function getHorz (evt)
{
  leftposi = evt.pageX;
  alert (leftposi);
}
document.onclick = getHorz;

screenX, screenY

Firefox Opera Safari Google Chrome Internet Explorer

Speichert die horizontale und vertikale Position des Mauszeigers absolut zum Bildschirm.


function getHorz (evt)
{
  // Anpassung für Internet Explorer
  if (!evt) 
  {
    evt = window.event;   
  }
  alert (evt.screenX);
}
document.onclick = getHorz;

type

Firefox Opera Safari Google Chrome Internet Explorer

Gibt die Art eines Ereignisses ohne on zurück, also zum Beispiel bei onmousedown ein "mousedown".


function getType (evt)
{
  // Anpassung für Internet Explorer
  if (!evt) 
  {
    evt = event;
  }
  alert(evt.type);
}
document.onmouseup = getType;
document.onkeyup = getType;

zurück zum vorherigen Abschnitt weiter zum nächsten Abschnitt