მოვლენების დამმუშავებლების განბლოკვა ციკლში JavaScript-ში
ახლა დავუშვათ, რომ გვაქვს არა ერთი ელემენტი, არამედ რამდენიმე. მაგალითად, რამდენიმე აბზაცი:
<p>text1</p>
<p>text2</p>
<p>text3</p>
მოდით თითოეულ ამ აბზაცს დავუმატოთ ფუნქცია func
როგორც დაწკაპუნების დამმუშავებელი:
let elems = document.querySelectorAll('p');
for (let elem of elems) {
elem.addEventListener('click', func);
}
function func() {
console.log(this.textContent);
}
ახლა მოდით შევცვალოთ კოდი ისე, რომ თითოეული აბზაცი რეაგირებდეს მხოლოდ პირველ დაწკაპუნებაზე. ამისთვის აბზაცზე დაწკაპუნებისას ჩვენ გავანბლოკავთ მასთან დაკავშირებულ დამმუშავებელს. ამ შემთხვევაში განბლოკვა მოხდება კონკრეტულად ამ აბზაცისთვის, სხვებს არ შეხება.
როგორც უკვე იცით, ელემენტი, რომელშიც მოხდა
მოვლენა, შეგიძლიათ მიიღოთ ფუნქცია-დამმუშავებელში
this-ის საშუალებით. ეს ნიშნავს, რომ
უნდა შესრულდეს დამმუშავებლის განბლოკვა this-იდან,
აი ასე:
let elems = document.querySelectorAll('p');
for (let elem of elems) {
elem.addEventListener('click', func);
}
function func() {
console.log(this.textContent);
this.removeEventListener('click', func); // ვანბლოკავთ დამმუშავებელს
}
მოცემულია აბზაცები. ნებისმიერი აბზაცის დაწკაპუნებაზე დაამატეთ მის ბოლოში ძახილის ნიშანი. გააკეთეთ ისე, რომ ეს დამატება მოხდეს მხოლოდ პირველ დაწკაპუნებაზე.