Cara Mengalih Keluar Semua Pendengar Acara daripada Objek DOM dalam JavaScript: Panduan Komprehensif

Javascript/DOM: Cara Mengalih Keluar Semua Pendengar Acara daripada Objek DOM

Persoalannya timbul: bagaimana seseorang boleh mengalih keluar sepenuhnya semua acara daripada objek, seperti div? Khususnya, pertanyaan berkaitan dengan acara yang ditambahkan menggunakan per div.addEventListener('click', eventReturner(), false);.

Mengalih Keluar Semua Pengendali Acara

Jika niatnya adalah untuk menghapuskan semua pengendali acara (tanpa mengira jenis) daripada elemen, pertimbangkan kaedah berikut:

var clone = element.cloneNode(true);

Teknik ini mengekalkan atribut dan kanak-kanak tanpa menjejaskan pengubahsuaian harta DOM.

Mengalih keluar Pengendali Acara Tanpa Nama bagi Jenis Tertentu

Pendekatan alternatif ialah menggunakan kaedah removeEventListener(), tetapi ia mungkin tidak berfungsi apabila berurusan dengan fungsi tanpa nama. Isu utama di sini ialah memanggil addEventListener dengan fungsi tanpa nama memberikan pendengar unik setiap kali fungsi itu digunakan. Akibatnya, percubaan untuk mengalih keluar pengendali acara menggunakan rujukan fungsi yang sama tidak mempunyai kesan.

Untuk menangani had ini, pertimbangkan dua alternatif ini:

1. Gunakan Fungsi Dinamakan:

function handler() {
     dosomething();
 }

 div.addEventListener('click',handler,false);

2. Buat Fungsi Pembungkus:

var _eventHandlers = {}; // somewhere global

const addListener = (node, event, handler, capture = false) => {
   if (!(event in _eventHandlers)) {
     _eventHandlers[event] = []
   }
   _eventHandlers[event].push({ node: node, handler: handler, capture: capture })
   node.addEventListener(event, handler, capture)
 }
...
addListener(div, 'click', eventReturner(), false)

Pendekatan ini membolehkan penciptaan pembungkus fungsi yang menyimpan rujukan kepada pendengar acara yang ditambahkan. Fungsi removeAllListeners yang sepadan kemudiannya boleh digunakan untuk mengalih keluar pengendali ini.

Atas ialah kandungan terperinci Cara Mengalih Keluar Semua Pendengar Acara daripada Objek DOM dalam JavaScript: Panduan Komprehensif. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!