HTML DOM Element addEventListener()
Voorbeelde
Voeg 'n klikgebeurtenis by 'n <button>-element:
element.addEventListener("click", myFunction);
function myFunction() {
document.getElementById("demo").innerHTML = "Hello World";
}
Meer kompakte kode:
element.addEventListener("click", function() {
document.getElementById("demo").innerHTML = "Hello World";
});
Meer voorbeelde hieronder.
Definisie en gebruik
Die addEventListener()
metode heg 'n gebeurtenishanteerder aan die element.
Sien ook:
Die element.removeEventListener() Metode
Die document.addEventListener() Metode
Die document.removeEventListener()-metode
Tutoriale
Sintaksis
element.addEventListener(event, function, useCapture)
Grense
Parameter | Description |
event | Required. The name of the event. Do not use the "on" prefix. Use "click" not "onclick". The Complete List of DOM Events. |
function | Required. The function to run when the event occurs. |
useCapture |
Optional (default = false).false - The handler is executed in the bubbling phase.true - The handler is executed in the capturing phase.
|
Terugkeerwaarde
GEEN |
Meer voorbeelde
Jy kan baie gebeurtenisse by dieselfde element voeg:
element.addEventListener("click", myFunction1);
element.addEventListener("click", myFunction2);
Jy kan verskillende gebeurtenisse by dieselfde element voeg:
element.addEventListener("mouseover", myFunction);
element.addEventListener("click", someOtherFunction);
element.addEventListener("mouseout", someOtherFunction);
Om parameterwaardes deur te gee, gebruik 'n "anonieme funksie":
element.addEventListener("click", function() {
myFunction(p1, p2);
});
Verander die agtergrondkleur van 'n <button>-element:
element.addEventListener("click", function() {
this.style.backgroundColor = "red";
});
Die verskil tussen borrel en vasvang:
element1.addEventListener("click", myFunction, false);
element2.addEventListener("click", myFunction, true);
Verwyder 'n gebeurtenis hanteerder:
element.addEventListener("mousemove", myFunction);
element.removeEventListener("mousemove", myFunction);
Blaaierondersteuning
element.addEventListener()
is 'n DOM Vlak 2 (2001) kenmerk.
Dit word ten volle ondersteun in alle blaaiers:
Chrome | IE | Edge | Firefox | Safari | Opera |
Yes | 9-11 | Yes | Yes | Yes | Yes |