Metodo universale on in jQuery

Per associare gli eventi si può anche utilizzare il metodo universale on. Come primo parametro accetta il nome dell'evento (ad esempio, 'click'), e come secondo - la funzione da associare.

Consideriamo un esempio sul seguente codice HTML:

<ul>
	<li>testo</li>
	<li>testo</li>
	<li>testo</li>
</ul>

Il CSS appare così:

li {
	width: 100px;
	cursor: pointer;
}

Ora riscriviamo il codice per li, che abbiamo scritto in precedenza tramite il metodo on. Per verificare il funzionamento clicca sugli elementi della lista:

$('li').on('click', function() {
	$(this).append('!');
});

Si può associare simultaneamente una funzione a diversi tipi di eventi - per fare ciò bisogna elencarli separati da spazio: 'click mousemove ecc.'. Ad esempio, così:

$('li').on('click mousemove', function func() {
	$(this).append('!');
});

Associa a tutti i link un evento - al passaggio del mouse sul link, il suo href viene aggiunto tra parentesi tonde alla fine del suo testo.

Associa a tutti gli input un evento - alla perdita del focus ogni input stampa il proprio value in un paragrafo con id=#test.