HTML DOM Dokument addEventListener()
Voorbeelde
Voeg 'n klikgebeurtenis by die dokument:
document.addEventListener("click", myFunction);
function myFunction() {
document.getElementById("demo").innerHTML = "Hello World";
}
Eenvoudiger sintaksis:
document.addEventListener("click", function(){
document.getElementById("demo").innerHTML = "Hello World";
});
Meer voorbeelde hieronder.
Definisie en gebruik
Die addEventListener()
metode heg 'n gebeurtenishanteerder aan die dokument.
Sien ook:
Die HTML DOM EventListener-tutoriaal
Die Document removeEventListener() Metode
Sintaksis
document.addEventListener(event, function, useCapture)
Grense
Parameter | Description |
event | Required. The event name. Do not use the "on" prefix. For example, use "click" instead of "onclick". HTML DOM events are listed in Complete HTML DOM Event Object Reference. |
function | Required. The function to run when the event occurs. When the event occurs, an event object is passed to the function as the first parameter. The type of the event object depends on the specified event. For example, the "click" event belongs to the MouseEvent object. |
useCapture |
Optional. A boolean. Specifies if the event should be executed in the capturing or in the bubbling phase (default). true - The event handler is executed in the capturing phase.false - The event handler is executed in the bubbling phase.
|
Terugkeerwaarde
NONE |
Meer voorbeelde
Jy kan baie gebeurtenisluisteraars by die dokument voeg:
document.addEventListener("click", myFunction1);
document.addEventListener("click", myFunction2);
Jy kan verskillende soorte gebeurtenisse byvoeg:
document.addEventListener("mouseover", myFunction);
document.addEventListener("click", someOtherFunction);
document.addEventListener("mouseout", someOtherFunction);
Wanneer u parameters deurgee, gebruik 'n "anonieme funksie" om 'n funksie met die parameters te noem:
document.addEventListener("click", function() {
myFunction(p1, p2);
});
Verander die agtergrondkleur van die dokument:
document.addEventListener("click", function(){
document.body.style.backgroundColor = "red";
});
Gebruik die removeEventListener() metode:
// Add an event listener
document.addEventListener("mousemove", myFunction);
// Remove event listener
document.removeEventListener("mousemove", myFunction);
Blaaierondersteuning
document.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 |