JavaScript-те оқиғаларды ажырату

Бұл сабақта біз бұрын элементтерге тіркелген оқиға өңдеушілерді қалай ажырататынымызды үйренеміз. Мысал ретінде келесі батырма берілген делік:

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

Осы батырмаға func функциясын тіркелейік:

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

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

Енді оқиға өңдеушісі бірінші рет басқанда істеп, содан кейін батырмадан ажыратылатын етейік. Бұл үшін арнайы removeEventListener әдісі бар. Бұл әдіс бірінші параметр ретінде оқиға түрін қабылдайды, ал екінші параметр ретінде ажыратылуы керек функцияға сілтеме.

Әдетте, бұл оқиға өңдеушісі тіркелген сияқты ажыратылады дегенді білдіреді. Яғни, егер біз оны былай тіркеген болсақ: addEventListener('click', func), онда сол параметрлермен ажыратамыз, мынаны былай: removeEventListener('click', func).

Енді, біз қойған міндетті шешейік:

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

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

Сілтеме және батырма берілген. Батырманы басқанда сілтеме мәтінінің соңына оның href атрибутының мазмұн дөңгелек жақша ішінде қосылады. Мұның тек бірінші рет басқанда істелетіндей етіңіз.

Мәні 1 саны болатын батырма берілген. Осы батырманы әр басқанда оның мәні бірге өсетіндей етіңіз. Батырма мәні 10-ға жеткен соң - оқиға өңдеушісін ажыратыңыз, солай етіп батырма басуға әсер етпейтін болады.