Event object

Het object event wordt gegenereerd wanneer een gebeurtenis wordt geactiveerd en bevat informatie daarover. Wanneer een gebeurtenis optreedt, wordt het object event doorgegeven aan de handlerfunctie.

Eigenschappen en methoden van het event object

Hieronder in de tabel staan de eigenschappen en methoden van het object event en hun beschrijving:

Naam	Beschrijving
`event.currentTarget`	Het huidige DOM-element in de bubblingfase van de gebeurtenis. Meestal is deze eigenschap equivalent aan `this` van de functie.
`event.data`	Optionele parameter. Het data-object dat wordt doorgegeven aan de gebeurtenismethode bij het koppelen van de uitvoerbare handler.
`event.delegateTarget`	Het element waaraan de zojuist aangeroepen jQuery-gebeurtenishandler was gekoppeld. Deze eigenschap is het meest nuttig bij gedelegeerde gebeurtenissen, wanneer de handler is gebonden aan een voorouder van het verwerkte element. Voor niet-gedelegeerde handlers, direct gebonden aan het element, is de waarde van `event.delegateTarget` gelijk aan de waarde van `event.currentTarget`.
`event.isDefaultPrevented`	De methode controleert of de methode `event.preventDefault` voor dit gebeurtenisobject is aangeroepen.
`event.isImmediatePropagationStopped`	De methode controleert of de methode `event.stopImmediatePropagation` voor dit gebeurtenisobject is aangeroepen.
`event.isPropagationStopped`	De methode controleert of de methode `event.stopPropagation` voor dit gebeurtenisobject is aangeroepen.
`event.isPropagationStopped`	De methode controleert of de methode `event.stopPropagation` voor dit gebeurtenisobject is aangeroepen.
`event.metaKey`	De methode controleert of de toets `META` was ingedrukt op het moment van activering van de gebeurtenis. Afhankelijk van het platform kan de toets verschillen. Retourneert `true` of `false`.
`event.namespace`	De naamruimte, gespecificeerd op het moment van aanroepen van de gebeurtenis. Deze eigenschap blijkt nuttig voor plug-inauteurs, wiens taken afhankelijk zijn van de gebruikte naamruimte.
`event.pageX`	Toont de positie van de muis ten opzichte van de linkerrand van het document.
`event.pageY`	Toont de positie van de muis ten opzichte van de bovenrand van het document.
`event.preventDefault`	Als deze methode wordt aangeroepen, wordt de standaardactie voor deze gebeurtenis niet uitgevoerd. Bijvoorbeeld, klikken op een link leidt niet tot een overgang naar een nieuwe URL. Om te controleren of deze methode is aangeroepen, kan de methode `event.isDefaultPrevented` worden gebruikt.
`event.relatedTarget`	Retourneert een ander DOM-element dat betrokken is bij de gebeurtenis, indien aanwezig. Voor `mouseout` toont het op welk element de muis is geplaatst, voor `mouseover` van welk element de muiscursor is weggehaald.
`event.result`	De laatste waarde die werd geretourneerd door de handler van de geactiveerde gebeurtenis, niet gelijk aan `undefined`. De eigenschap kan nuttig zijn voor het verkrijgen van waarden van eigen gebeurtenissen.
`event.stopImmediatePropagation`	Annuleert de werking van alle overige gebeurtenishandlers verbonden met het element en voorkomt het bubbelen van de gebeurtenis omhoog in de DOM-structuur. Om eenvoudig te voorkomen dat de gebeurtenis bubbelt naar voorouderelementen, maar wel de werking van andere gebeurtenishandlers toe te staan, kan de methode `event.stopPropagation` worden gebruikt. Gebruik de methode `event.isImmediatePropagationStopped` om te controleren of `event.stopImmediatePropagation` voor dit gebeurtenisobject is aangeroepen.
`event.stopPropagation`	Voorkomt het bubbelen van de gebeurtenis omhoog in de DOM- structuur. Onthoud dat andere handlers blijven werken voor dit element. Deze methode werkt voor eigen gebeurtenissen, geactiveerd met behulp van de methode `trigger`. Om te controleren of deze methode is aangeroepen, gebruik `event.isPropagationStopped`.
`event.target`	Het DOM-element dat de gebeurtenis heeft geïnitieerd. Dit kan het element zijn dat geregistreerd is voor de gebeurtenis of een afstammeling daarvan. Het is erg nuttig om `event.target` en `this` te vergelijken, om te bepalen of de gebeurtenis bubbelt. De eigenschap is nuttig bij het delegeren van gebeurtenissen, wanneer gebeurtenissen bubbelen.
`event.timeStamp`	Het tijdsverschil in milliseconden tussen het moment waarop de gebeurtenis door de browser is gemaakt en 1 januari 1970. De eigenschap kan nuttig zijn bij het bepalen van de prestaties van een gebeurtenis door het verkrijgen van het verschil in waarden van `event.timeStamp` voor twee momenten in de code. Als u eenvoudig de huidige tijd binnen een gebeurtenishandler wilt verkrijgen, gebruik dan de methode `getTime`.
`event.type`	In deze eigenschap staat het type gebeurtenis.
`event.which`	Deze eigenschap geeft aan welke toets van het toetsenbord of muis is ingedrukt. Voor de muis: `1` - linkerknop, `2` - scrollwiel, `3` - rechterknop. Gebruik `event.which` in plaats van `event.button`.

Andere eigenschappen van het event object

Er zijn ook andere eigenschappen die worden gekopieerd naar het object event:

altKey, button, buttons, cancelable, char, charCode, clientX, clientY, ctrlKey, detail, eventPhase, key, keyCode, offsetX, offsetY, originalTarget, screenX, screenY, shiftKey, toElement, view.

Om toegang te krijgen tot eigenschappen die hierboven niet zijn vermeld, kan het object event.originalEvent worden gebruikt.

Voorbeeld

Laten we in een div weergeven - welke toetsen er waren ingedrukt:

<input id="test" value="type something">
<div id="text"></div>

$('#test').on('keydown', function(event) {
	$('#text').html(event.type + ": " +  event.which);
});

Voorbeeld

Laten we in een div weergeven - op welke tag we klikken:

<body>
	<div id="text"></div>
	<div>
		<p>
			<strong><span>click</span></strong>
		</p>
	</div>
</body>

span, strong, p {
	display: block;
	padding: 10px;
	border: 1px solid black;
}

$('body').click(function(event) {
	$('#text').html('clicked: ' + event.target.nodeName);
});

Zie ook

methode on,
die het mogelijk maakt een gebeurtenishandler aan een element te koppelen
methode trigger,
die het mogelijk maakt alle gebeurtenishandlers te activeren, gekoppeld aan een element voor gebeurtenissen van het opgegeven type
methode triggerHandler,
die het mogelijk maakt alle gebeurtenishandlers te activeren, gekoppeld aan een element
jQuery gebeurtenissen