Menyahikat Peristiwa dalam JavaScript

Dalam pelajaran ini, kita akan belajar bagaimana untuk menyahikat pengendali peristiwa yang sebelum ini telah diikat oleh kita kepada elemen. Katakan untuk contoh diberikan tombol berikut:

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

Mari kita ikat fungsi func kepada tombol ini:

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

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

Sekarang mari kita buat supaya pengendali peristiwa hanya berfungsi pada klik pertama, kemudian disyahikat daripada tombol. Untuk ini terdapat kaedah khas removeEventListener. Kaedah ini menerima jenis peristiwa sebagai parameter pertama, dan rujukan kepada fungsi yang perlu disyahikat sebagai parameter kedua.

Biasanya, ini bermakna pengendali peristiwa disyahikat dengan cara yang sama seperti ia diikat. Iaitu, jika kita mengikatnya seperti ini: addEventListener('click', func), maka kita akan menyahikatnya dengan parameter yang sama, seperti ini: removeEventListener('click', func).

Jadi, mari selesaikan tugas yang telah kita tetapkan:

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

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

Diberikan sebuah pautan dan sebuah tombol. Dengan menekan tombol, tambahkan kandungan atribut href-nya ke hujung teks pautan dalam kurungan. Pastikan penambahan ini hanya berlaku pada tekanan pertama.

Diberikan sebuah tombol, yang nilainya ialah nombor 1. Buat supaya apabila diklik pada tombol ini, nilainya bertambah satu setiap kali. Selepas nilai tombol mencapai 10 - nyahikat pengendali peristiwa, supaya tombol tidak lagi bertindak balas kepada penekanan.