Sündmuste delegeerimine jQuery-s

Kui olete JavaScripti õppinud, olete juba kokku puutunud sündmuste delegeerimise teemaga, mille abil saab näiteks vabaneda uutele elementidele sündmuste seadistamisega seotud probleemidest. Vaatame, kuidas see välja näeb jQuery-s.

Võtame järgmise HTML-koodi:

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

CSS selle jaoks näeb välja selline:

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

Nüüd seome meetodi on abil click mitte nimekirja punktile li, nagu me eelmistes õppetükkides tegime, vaid nimekirjale endale ul. Samuti edastame teise (valikulise) parameetrina 'li' järeltulijate selektorina. Vaatame, mis saadi:

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