Universell on-metode i jQuery

For å binde events kan du også bruke den universelle metoden on. Den tar eventnavnet som første parameter (for eksempel 'click'), og som andre - funksjonen som skal bindes.

La oss se på et eksempel med følgende HTML-kode:

<ul>
	<li>text</li>
	<li>text</li>
	<li>text</li>
</ul>

CSS ser slik ut:

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

La oss nå omskrive koden for li som vi skrev tidligere ved hjelp av metoden on. For å teste hvordan det fungerer, trykk på punktene i listen:

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

Du kan binde én funksjon til flere typer events samtidig - for å gjøre dette må du liste dem opp med mellomrom: 'click mousemove osv.'. For eksempel slik:

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

Bind eventet til alle lenker - når du holder musepekeren over en lenke, legges dens href til i parentes på slutten av lenketeksten.

Bind eventet til alle input-felter - når et input-felt mister fokus, skal hvert input-felt skrive ut sin value i avsnittet med id=#test.