JavaScriptда вокенталарни бўшатиш

Ушбу дарсда биз илгари элементларга боглаган вокенталар ишловчиларимизни қандай бўшатишни ўрганамиз. Мисол учун куйидаги tугма берилган деб фараз қилайлик:

<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);
}

Ҳаволa ва тугма берилган. Тугма босиlgанда ҳаволa матинининг охирига унинг href атрибутининг кийматини жуфт қавс ичида қўшинг. Шундай қилингки, бу қўшиш фақат биринчи босилгандагина амалга ошади.

Қиймати 1 сон бўлган тугма берилган. Шундай қилингки, ушбу тугма босиlgанда унинг қиймати ҳар дафтар биттага orthi. Тугманинг қиймати 10 га етganidan сўнг, вокента ишловчисини бўшатинг, тугма бошқа босилганда реакция кўрсатмасин.