Metoda universală on în jQuery

Pentru legarea evenimentelor se poate folosi și metoda universală on. Primul parametru primește numele evenimentului (de exemplu, 'click'), iar al doilea - funcția care trebuie legată.

Să analizăm un exemplu cu următorul cod HTML:

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

CSS arată astfel:

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

Acum să rescriem codul pentru li, pe care l-am scris anterior prin metoda on. Pentru a verifica funcționarea faceți clic pe elementele listei:

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

Se poate lega o singură funcție simultan la mai multe tipuri de evenimente - pentru aceasta acestea trebuie enumerate separate prin spațiu: 'click mousemove etc.'. De exemplu, astfel:

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

Legă toate link-urile la eveniment - la hover pe link, la sfârșitul textului său se adaugă href-ul său în paranteze rotunde.

Legă toate câmpurile input la eveniment - la pierderea focusului fiecare input își afișează propria sa valoare value într-un paragraf cu id=#test.