Универсален метод on в jQuery

За привързване на събития също може да се използва универсалният метод on. Първият параметър, който приема, е името на събитието (например, 'click'), а вторият - функцията, която трябва да се привърже.

Нека разгледаме пример със следния HTML код:

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

CSS изглежда така:

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

Сега нека пренапишем кода за li, който писахме по-рано, чрез метода on. За да проверите работата, кликнете върху елементите от списъка:

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

Може едновременно да се привърже една функция към няколко типа събития - за това трябва да се изброят чрез интервал: 'click mousemove и т.н.'. Например, така:

javascript$('li').on('click mousemove', function func() {
  $(this).append('!');
});
Задание 1

Привържете към всички връзки събитие - при посочване на връзка в края на нейния текст да се добавя нейният href в кръгли скоби.

Задание 2

Привържете към всички полета за въвеждане събитие - при загуба на фокус всяко поле за въвеждане извежда своята value в абзац с id=#test.