L'oggetto event

L'oggetto event viene generato quando un evento si verifica e contiene informazioni su di esso. Quando appare un evento, l'oggetto event viene passato alla funzione di gestione.

Proprietà e metodi dell'oggetto event

La tabella seguente elenca le proprietà e i metodi dell'oggetto event e la loro descrizione:

Nome	Descrizione
`event.currentTarget`	L'elemento DOM corrente durante la fase di bubbling dell'evento. Di solito questa proprietà è equivalente a `this` della funzione.
`event.data`	Parametro opzionale. L'oggetto dati passato al metodo dell'evento quando viene allegato il gestore eseguibile.
`event.delegateTarget`	L'elemento a cui è stato appena attaccato il gestore di eventi jQuery richiamato. Questa proprietà è più utile negli eventi delegati, quando il gestore è legato a un antenato dell'elemento gestito. Per i gestori non delegati, legati direttamente all'elemento, il valore di `event.delegateTarget` corrisponde al valore di `event.currentTarget`.
`event.isDefaultPrevented`	Il metodo verifica se è stato chiamato il metodo `event.preventDefault` per questo oggetto evento.
`event.isImmediatePropagationStopped`	Il metodo verifica se è stato chiamato il metodo `event.stopImmediatePropagation` per questo oggetto evento.
`event.isPropagationStopped`	Il metodo verifica se è stato chiamato il metodo `event.stopPropagation` per questo oggetto evento.
`event.isPropagationStopped`	Il metodo verifica se è stato chiamato il metodo `event.stopPropagation` per questo oggetto evento.
`event.metaKey`	Il metodo verifica se è stato premuto il tasto `META` al momento del verificarsi dell'evento. A seconda della piattaforma, il tasto può essere diverso. Restituisce `true` o `false`.
`event.namespace`	Lo spazio dei nomi specificato al momento della chiamata dell'evento. Questa proprietà risulterà utile per gli autori di plugin, i cui compiti dipendono dallo spazio dei nomi utilizzato.
`event.pageX`	Mostra la posizione del mouse rispetto al bordo sinistro del documento.
`event.pageY`	Mostra la posizione del mouse rispetto al bordo superiore del documento.
`event.preventDefault`	Se questo metodo viene chiamato, l'azione predefinita per questo evento non verrà eseguita. Ad esempio, cliccare su un link non porterà a un nuovo URL. Per verificare se questo metodo è stato chiamato, puoi usare il metodo `event.isDefaultPrevented`.
`event.relatedTarget`	Restituisce un altro elemento DOM che partecipa all'evento, se presente. Per `mouseout` mostra su quale elemento è posizionato il mouse, per `mouseover` da quale elemento il cursore del mouse è stato spostato.
`event.result`	L'ultimo valore restituito dal gestore dell'evento attivato, diverso da `undefined`. La proprietà può essere utile per ottenere valori di eventi personalizzati.
`event.stopImmediatePropagation`	Annulla l'esecuzione di tutti i rimanenti gestori di eventi associati all'elemento e impedisce la propagazione dell'evento verso l'alto nell'albero DOM. Per impedire semplicemente all'evento di propagarsi agli elementi antenati, ma consentire l'esecuzione di altri gestori di eventi, puoi usare il metodo `event.stopPropagation`. Usa il metodo `event.isImmediatePropagationStopped` per verificare se è stato chiamato `event.stopImmediatePropagation` per questo oggetto evento.
`event.stopPropagation`	Impedisce la propagazione dell'evento verso l'alto nel DOM. Ricorda che altri gestori continueranno a funzionare per questo elemento. Questo metodo funziona per eventi personalizzati, attivati tramite il metodo `trigger`. Per verificare se questo metodo è stato chiamato, usa `event.isPropagationStopped`.
`event.target`	L'elemento DOM che ha inizializzato l'evento. Può essere l'elemento registrato per l'evento o un suo discendente. È molto utile confrontare `event.target` e `this` per determinare la propagazione dell'evento. La proprietà è utile nella delega degli eventi, quando gli eventi si propagano.
`event.timeStamp`	La differenza di tempo in millisecondi tra il momento in cui l'evento è stato creato dal browser e il 1 Gennaio 1970. La proprietà può essere utile per determinare le prestazioni dell'evento ottenendo la differenza dei valori di `event.timeStamp` per due momenti nel codice. Se vuoi semplicemente ottenere l'ora corrente all'interno di un gestore di eventi, usa il metodo `getTime`.
`event.type`	In questa proprietà è specificato il tipo di evento.
`event.which`	Questa proprietà indica quale tasto della tastiera o del mouse è stato premuto. Per il mouse: `1` - tasto sinistro, `2` - rotellina, `3` - tasto destro. Usa `event.which` invece di `event.button`.

Altre proprietà dell'oggetto event

Ci sono altre proprietà che vengono copiate nell'oggetto event:

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

Per accedere a proprietà non elencate sopra, puoi usare l'oggetto event.originalEvent.

Esempio

Visualizziamo in un div - quali tasti sono stati premuti:

<input id="test" value="digita qualcosa">
<div id="text"></div>

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

Esempio

Visualizziamo in un div - su quale tag clicchiamo:

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

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

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

Vedi anche

metodo on,
che permette di associare un gestore di eventi a un elemento
metodo trigger,
che permette di attivare tutti i gestori di eventi, associati a un elemento per eventi di un tipo specificato
metodo triggerHandler,
che permette di attivare tutti i gestori di eventi, associati a un elemento
eventi jQuery