დელეგირება jQuery-ში

თუ JavaScript-ს სწავლობდით, მაშინ უკვე შეგხვედრიათ მოვლენების დელეგირების თემა, რომლის საშუალებითაც შესაძლებელია, მაგალითად, ახალ ელემენტებზე მოვლენების მიმაგრების პრობლემების მოგვარება. ვნახოთ, როგორ გამოიყურება ეს jQuery-ში.

ავიღოთ შემდეგი HTML კოდი:

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

CSS მისთვის ასე გამოიყურება:

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

ახლა კი, მეთოდის on გამოყენებით, მივაბათ click მოვლენა არა სიის ელემენტს li, როგორც ეს წინა გაკვეთილებში გავაკეთეთ, არამედ თავად სიას ul. ასევე მეორე (არასავალდებულო) პარამეტრად გადავცეთ 'li', როგორც შვილობილი ელემენტების სელექტორი. ვნახოთ, რა გამოვიდა:

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

მოცემულია ul, მასში რამდენიმე li. ul-ის ქვემოთ გაუკეთეთ ღილაკი, რომლის დაჭერითაც ul-ის ბოლოს დაემატება ახალი li ტექსტით 'პუნქტი'. გაუკეთეთ ისე, რომ ყოველ li-ზე დაწკაპუნებისას, მას ბოლოს დაემატოს '!'. ეს უნდა მუშაობდეს ახლად დამატებული li-ებისთვისაც. ამოცანა ამოხსენით დელეგირების გამოყენებით (ანუ მოვლენა უნდა იყოს მიმაგრებული ul-ზე).

მოცემულია ცხრილი მომხმარებლებით ორი სვეტით: სახელი და გვარი. ცხრილის ქვემოთ გაუკეთეთ ფორმა, რომლის საშუალებითაც შესაძლებელი იქნება ცხრილში ახალი მომხმარებლის დამატება. გაუკეთეთ ისე, რომ ნებისმიერ უჯრაზე დაწკაპუნებისას გამოჩნდეს prompt, რომლის საშუალებითაც შესაძლებელია უჯრის ტექსტის შეცვლა. ამოცანა ამოხსენით დელეგირების გამოყენებით (ანუ მოვლენა უნდა იყოს მიმაგრებული table-ზე).