JavaScript Events
- Vorige pagina JS-object
- Volgende pagina JS-tekenreeks
HTML-gebeurtenissen zijn "gebeurtenissen" die plaatsvinden op HTML-elementen.
Wanneer JavaScript wordt gebruikt op een HTML-pagina, kan JavaScript deze gebeurtenissen "afhandelen".
HTML-gebeurtenissen
HTML-gebeurtenissen kunnen iets zijn dat de browser of de gebruiker doet.
Hier zijn enkele voorbeelden van HTML-gebeurtenissen:
- Een HTML-webpagina is volledig geladen
- Een HTML-inputveld wordt gewijzigd
- Een HTML-knop wordt geklikt
Normaal gesproken willen gebruikers iets doen wanneer een gebeurtenis optreedt.
JavaScript laat u code uitvoeren wanneer een gebeurtenis wordt gedetecteerd.
Door JavaScript-code,HTML staat u toe om event-handlers toe te voegen aan HTML-elementen.
Gebruik enkele aanhalingstekens:
<element event='enkele JavaScript>
Gebruik dubbele aanhalingstekens:
<element event="enkele JavaScript">
In het volgende voorbeeld:onclick
attributen (en code) worden toegevoegd aan <button>
Element:
Voorbeeld
<button onclick='document.getElementById("demo").innerHTML=Date()'>Wat is de huidige tijd?</button>
In het vorige voorbeeld veranderde de JavaScript-code de inhoud van het element met id="demo".
In de volgende voorbeeld, code (gebruikend this.innerHTML
)veranderde de inhoud van zijn eigen element:
Voorbeeld
<button onclick="this.innerHTML=Date()">Wat is de huidige tijd?</button>
JavaScript-code bevat vaak veel regels. Het is gebruikelijker om functies aan te roepen via event-attributen:
Voorbeeld
<button onclick="displayDate()">Wat is de huidige tijd?</button>
Veelvoorkomende HTML-gebeurtenissen
Hier zijn enkele veelvoorkomende HTML-gebeurtenissen:
gebeurtenis | beschrijving |
---|---|
onchange | De HTML-element is veranderd |
onclick | De gebruiker klikt op een HTML-element |
onmouseover | De gebruiker verplaatst de muis naar een HTML-element |
onmouseout | De gebruiker verplaatst de muis van een HTML-element |
onkeydown | De gebruiker drukt op een toetsbalktoets |
onload | De browser heeft de pagina geladen |
Een completer lijst:CodeW3C.com JavaScript referentiemanual HTML DOM evenementen.
Wat kan JavaScript doen?
Event handlers kunnen worden gebruikt om gebruikersinput, gebruikersacties en browseracties te verwerken:
- Wat moet worden gedaan wanneer de pagina wordt geladen?
- Wat moet worden gedaan wanneer de pagina wordt gesloten?
- Wat moet worden uitgevoerd wanneer de gebruiker op een knop klikt?
- Wat moet worden geverifieerd wanneer de gebruiker gegevens invoert?
- enz.
Er zijn veel verschillende manieren om evenementen met JavaScript te verwerken:
- HTML-evenement eigenschappen kunnen JavaScript-code uitvoeren.
- HTML-evenement eigenschappen kunnen JavaScript-functies aanroepen.
- Je kunt je eigen event handler toewijzen aan een HTML-element.
- Je kunt voorkomen dat een evenement wordt verzonden of behandeld.
- enz.
Je zult meer over evenementen en event handlers leren in het HTML DOM-kapitaal.
- Vorige pagina JS-object
- Volgende pagina JS-tekenreeks