Odpiranje vezav poslušalcev dogodkov v zanki v JavaScript

Recimo, da imamo zdaj ne en element, ampak več. Na primer, več odstavkov:

html<p>text1</p>
<p>text2</p>
<p>text3</p>

Vsakemu od teh odstavkov dodelimo funkcijo func kot poslušalca klika:

javascriptlet elems = document.querySelectorAll('p');

for (let elem of elems) {
  elem.addEventListener('click', func);
}

function func() {
  console.log(this.textContent);
}

Prilagodimo zdaj kodo tako, da bo vsak odzovele samo na prvi klik nanj. Da bi to naredili, bomo ob kliku na odstavek odstrsnili z njega vezanega poslušalca. Pritem bo odvezava specifično za ta odstavek, ne da bi vplivala na druge.

Kot že veste, element, v katerem se je zgodil dogodek, lahko dobite v funkciji-poslušalcu preko this. To pomeni, da je treba izvesti odvezavo poslušalca od this, takole:

javascriptlet elems = document.querySelectorAll('p');

for (let elem of elems) {
  elem.addEventListener('click', func);
}

function func() {
  console.log(this.textContent);
  this.removeEventListener('click', func); // odvežemo poslušalca
}