DOM-Grundlagen-Tutorial-Ereignistypen_Grundkenntnisse

Für Benutzerereignistypen werden am häufigsten Maus, Tastatur und Browser verwendet.

1. Mausereignisse:

Mausereignisse werden häufig verwendet. Das folgende Beispiel testet verschiedene Mausereignisse

Code kopieren Der Code lautet wie folgt: Funktionshandle (oEvent) { var disp = document.getElementById("display"); if (window.event) oEvent = window.event; // Kompatibilität behandeln und das Objekt abrufen disp.innerHTML = "Maus-Ereignisname:" oEvent.type " "; } window.onload = function() { var oP = document.getElementById("box"); oP.onmousedown = handle; oP.onmouseover = handle; oP.onmouseup = handle; oP.onmouseout = handle; oP.onclick = handle; oP.ondblclick = handle; } Packungsinhalt

Maustastenwert-Tastentest (mit Vergleichstabelle)

Code kopieren

Der Code lautet wie folgt: Funktion TestClick(oEvent) { var oDiv = document.getElementById("display"); Wenn (window.event) oEvent = window.event; oDiv.innerHTML = oEvent.button //Wert der Schaltfläche ausgeben } document.onmousedown = TestClick; window.onload = TestClick; //Testen, dass keine Taste gedrückt wird

2. Tastaturereignisse

Es gibt nicht viele Arten von Tastaturereignissen, sondern nur drei Arten von Ereignissen.

keydown (drücken Sie eine Taste und halten Sie sie gedrückt, um kontinuierlich auszulösen)

Tastendruck (wird ausgelöst, wenn eine Taste gedrückt und ein Zeichen generiert wird, d. h. Funktionstasten wie Umschalt, Alt, Strg usw. werden ignoriert)

keyup (wird ausgelöst, wenn eine Taste losgelassen wird)

Beispiel für die Tastaturüberwachung:

Code kopieren Der Code lautet wie folgt: Funktionshandle (oEvent) { Wenn (window.event) oEvent = window.event; // Behandlungskompatibilität, Ereignisobjekte abrufen var oDiv = document.getElementById("display"); oDiv.innerHTML = oEvent.type " " //Name des Ausgabeereignisses } window.onload = function() { var oTextArea = document.getElementById("textin"); oTextArea.onkeydown = handle; //Alle Tastaturereignisse abhören oTextArea.onkeyup = handle; oTextArea.onkeypress = handle; }

Für die Tastatur ist das Wichtigste nicht der Name des Ereignisses, sondern welche Taste gedrückt wurde. Da IE kein charCode-Attribut hat und der keyCode nur dann mit dem Standard-DOM-Schlüsselcode übereinstimmt, wenn die Ereignisse keydown und keyup auftreten, Entspricht dem Tastencode im Tastendruckereignis, daher wird die folgende Methode verwendet.

Code kopieren

Der Code lautet wie folgt: oEvent.charCode = (oEvent.type == "keypress ")? oEvent.keycode:(); Der Grund, warum keyCode nicht verwendet wird, liegt darin, dass er Tastaturtasten und keine Ausgabezeichen darstellt. Daher ist der Schlüsselcode bei der Ausgabe von „a“ und „A“ gleichwertig und der Zeichencode wird durch Zeichen unterschieden. Außerdem ist der Tastencodewert des Standard-DOM immer 0 Beispiel: Eigenschaften für Tastaturereignisse:

Code kopieren

Der Code lautet wie folgt: Funktionshandle (oEvent) { var oDiv = document.getElementById("display"); Wenn (window.event) oEvent = window.event; // Behandlungskompatibilität, Ereignisobjekte abrufen //Legen Sie den Wert von ie charcode fest oEvent.charCode = (oEvent.type == "keypress") ? oEvent.keyCode : 0; oDiv.innerHTML = oEvent.type „:charCode“ oEvent.charCode „keyCode“ oEvent.keyCode „ “ //Ausgabetest } window.onload = function() { var oTextArea = document.getElementById("textin"); oTextArea.onkeydown = handle; //Alle Tastaturereignisse abhören oTextArea.onkeypress = handle; }

3.htm-Ereignis Für Browser haben verschiedene HTML-Ereignisse ihre eigenen Ereignisse, von denen einige häufig von Benutzern angetroffen werden, z. B. Laden, Fehler, Auswählen usw. Häufig verwendete HTML-Ereignisse sind wie folgt:

Das Ladeereignis ist eines der am häufigsten verwendeten Ereignisse, da das DOM-Framework vor dem Laden der Seite noch nicht erstellt wurde und daher keine zugehörigen Vorgänge ausgeführt werden können.

Weisen Sie dem Fensterobjekt „load“ zu, und das Entladeereignis entspricht den Methoden „onload“ und „onunload“ des Tags