on მეთოდი

on მეთოდი საშუალებას აძლევს დაამატოს დამმუშავებელი მოვლენების ელემენტს. დამმუშავებლის წასაშლელად შეგიძლიათ გამოიყენოთ მეთოდი off, რომ მოვლენა მოქმედებდეს მხოლოდ ერთხელ, და შემდეგ დამმუშავებელმა თავად წაშალოს თავი - გამოიყენეთ მეთოდი one. ელემენტები, რომლებსაც ჩვენ ვამაგრებთ დამმუშავებელს, უნდა არსებობდნენ on-ის გამოძახების დროს.

სინტაქსი

ასე ვამატებთ მოვლენის დამმუშავებელს ელემენტს, როგორც პირველი პარამეტრი სტრიქონის სახით გადაეცემა ერთი ან რამდენიმე მოვლენა, გამოყოფილი სფეისებით, მეორე პარამეტრად გადავცემთ დამატებით ფილტრაციის სელექტორს ელემენტის შიგნით არსებული შთამომავლებისთვის, მესამე - დამატებით მონაცემებს, რომლებიც გადაეცემა დამმუშავებელს event.data-ის თვისებაში მოვლენის დაწყების დროს. მეორე და მესამე პარამეტრები არასავალდებულოა. მეოთხედ გადავცემთ დამმუშავებელ ფუნქციას, რომელშიც გადაეცემა მოვლენის ობიექტი და არასავალდებულო დამატებითი პარამეტრები. თუ დამმუშავებელი ფუნქციის ნაცვლად გადავცემთ false, მაშინ ფუნქცია უბრალოდ დააბრუნებს false-ს:

$(სელექტორი).on(მოვლენები, [სელექტორი], [მონაცემები], დამმუშავებელი-ფუნქცია(მოვლენის ობიექტი, [დამატებითი პარამეტრები]));

შეგიძლიათ გამოიყენოთ on მეთოდი სხვაგვარად, მაშინ პირველ პარამეტრად გადაეცემა JavaScript-ის ობიექტი, სადაც გასაღებები - მოვლენის ტიპი, ხოლო მნიშვნელობები - დამმუშავებელი ფუნქციები, რომლებიც იწყება მოვლენებისთვის:

$(სელექტორი).on({'მოვლენის ტიპი': handler}, [სელექტორი], [მონაცემები]);

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

მაგალითი

მოდით alert-ში ვაჩვენოთ აბზაცის ტექსტი #test-ით მასზე დაწკაპუნებისას, სხვა აბზაცებზე დაწკაპუნებები არაფერს არ გამოიწვევს:

<p>ტექსტი1</p>
<p id="test">ტექსტი2</p>
<p>ტექსტი3</p>

$('#test').on('click', function() {
	alert( $(this).text() );
});

მაგალითი

მოდით აბზაცზე დაწკაპუნებისას გამოვიტანოთ ის მონაცემები, რომლებიც ჩვენ გადავეცით on მეთოდს. გამოვიყენოთ დამმუშავებელი ფუნქცია testFunc, რომელიც ჩვენ შევქმენით:

<p>დაწკაპუნება</p>

function testFunc(event) {
	alert(event.data.text);
}

$('p').on('click', {text: 'aaa'}, testFunc);

იხილეთ აგრეთვე

მეთოდი off,
რომელიც საშუალებას აძლევს წაშალოს მოვლენის დამმუშავებელი ელემენტიდან
მეთოდი one,
რომელიც საშუალებას აძლევს მოვლენას მოქმედებდეს ერთხელ, და შემდეგ ავტომატურად წაშალოს დამმუშავებელი
ობიექტი event,
რომელიც შეიცავს ინფორმაციას მოვლენაზე
მეთოდი trigger,
რომელიც საშუალებას აძლევს გაუშვას ყველა მოვლენის დამმუშავებელი, მიმაგრებული ელემენტზე მოცემული ტიპის მოვლენებისთვის
JavaScript-ის მეთოდი bind,
რომელიც საშუალებას აძლევს მიმაგროს კონტექსტი ფუნქციას