Прывязванне падзей у jQuery

Амаль кожнай падзеі JavaScript адпавядае свой метад jQuery. Напрыклад, клік па элементах можна адлавіць так: $(селектар).click(функцыя).

Разгледзім наступны HTML код:

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

Для яго напісаны CSS:

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

Давайце зробім так, каб па кліку на любую li вывадзіўся клічнік. Панаціскайце на пункты спісу:

javascript$('li').click(function() {
  alert('!');
});

Усярэдзіне прывязанай функцыі даступны this, які спасылаецца на той элемент, у якім адбылася падзея (у нашым выпадку на li, на якую быў клік). Гэты this можна выкарыстоўваць стыле JavaScript, напрыклад, this.innerHTML або ў стылі jQuery - для гэтага гэты this варта абагнуць у $, вось так: $(this).

Вазьмем HTML код:

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

Да гэтага коду напісаны наступныя CSS стылі:

cssli {
  width: 100px;
}
li:hover {
  color: red;
  cursor: pointer;
}

Давайце зробім так, каб па кліку на li ёй у канец дадаваўся '!'. Для праверкі працы панаціскайце на пункты спісу:

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