Адвязванне падзей у 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);
}