This function is needed for some time. But when tasks are completed I need to disable it, that after clicking on 'board' it wouldn't work.
board.addEventListener('click', event => {
if (event.target.classList.contains('circle')) {
score++
event.target.remove()
createRandomCircle()
} else if (!event.target.classList.contains('circle')) {
fault++
}
})
//Here I want to deactivate this event listener
I would call a handler function that returns a new named function (a closure) to act as the listener. You can then go through your tasks, and remove the listener when they're complete.
const board = document.querySelector('#board');
board.addEventListener('click', handler(), false);
function handler() {
// This is the function the listener uses
return function listener(e) {
console.log(e.target);
console.log('Task one');
console.log('Task two');
board.removeEventListener('click', listener);
console.log('The button no longer works.');
}
}
<button id="board">Board</button>