jQueryде делегирование

Эгер сиз JavaScript үйрөнгөн болсоңуз, анда сиз жөн эле жаңы элементтер үчүн окуяларды кошууда көйгөйлөрдөн арылууга мүмкүндүк берген окуяларды делегирлөө темасына дуушар болгонсуз. Келгиле, jQuery үчүн бул кандай көрүнөрүн карайлы.

Төмөнкү HTML кодун алалы:

<ul>
	<li>текст</li>
	<li>текст</li>
	<li>текст</li>
</ul>

Анын CSSи ушундай көрүнөт:

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

Келгиле, эми on методунун жардамы менен, мурунку сабактарда кылганыбыздай, тизме пунктуна liга эмес, тизменин өзүнө ulга click методу байлап, ошондой эле экинчи (милдеттүү эмес) параметр катары туунда элементтердин селектору катары 'li' берели. Эмне болгонун карайлы:

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

ul берилген, анда бир нече li бар. ulдин астына баскыч жасаңыз, басканда ulдин аягына 'пункт' тексти бар жаңы li кошулушу керек. Ар бир li чыкылдатылганда, анын аягына '!' кошулгандай кылыңыз. Бул кошулган жаңы liлер үчүн да иштеши керек. Маселени делегирлөө менен чечиңиз (башкача айтканда окуя ulге кошулушу керек).

Эки колонкалуу (аты жана фамилиясы) колдонуучулар таблицасы берилген. Таблицанын астына форма жасаңыз, анын жардамы менен жаңы колдонуучуну таблицага кошо алышыңыз керек. Каалаган клетка чыкылдатылганда, клетканын текстин өзгөртүүгө мүмкүндүк берген prompt пайда болгондой кылыңыз. Маселени делегирлөө менен чечиңиз (башкача айтканда окуя tableге кошулушу керек).