Одврзување на настани во JavaScript

Во оваа лекција ќе научиме како да одврземе обработувачи на настани, кои претходно беа приврзани од нас на елементи. Нека за пример е дадена следната копча:

html<input id="button" type="submit">

Да ја приврземе на оваа копча функцијата func:

javascriptlet button = document.querySelector('#button');
button.addEventListener('click', func);

function func() {
  console.log('!!!');
}

Да направиме сега така што обработувачот на настанот да се активира на првиот клик, а потоа да се одврзе од копчето. За ова постои специјален метод removeEventListener. Овој метод како прв параметар го прифаќа типот на настанот, а како втор - референца до функцијата која треба да се одврзе.

Како по правило, ова значи дека обработувачот на настанот се одврзува на ист начин како што се приврзувал. Тоа е, ако сме го приврзале вака: addEventListener('click', func), тогаш и ќе го одврземе со истите параметри, вака: removeEventListener('click', func).

Значи, да ја решиме поставената задача:

javascriptlet button = document.querySelector('#button');
button.addEventListener('click', func);

function func() {
  console.log('!!!');
  this.removeEventListener('click', func);
}