Lebih
Bagaimana untuk memeriksa apakah secara dinamis terpasang event listener ada atau tidak?
Berikut ini adalah masalah saya: apakah mungkin entah bagaimana untuk memeriksa keberadaan dinamis yang terpasang acara pendengar? Atau bagaimana saya dapat memeriksa status "onclick" (?) properti di DOM? Saya telah mencari di internet seperti Stack Overflow untuk sebuah solusi, tetapi tidak berhasil. Di sini saya html:
<a id="link1" onclick="linkclick(event)"> link 1 </a>
<a id="link2"> link 2 </a> <!-- without inline onclick handler -->
Kemudian di Javascript saya lampirkan dibuat secara dinamis event listener untuk 2 link:
document.getElementById('link2').addEventListener('click', linkclick, false);
Kode berjalan dengan baik, tetapi semua upaya saya untuk mendeteksi yang terpasang pendengar yang gagal:
// test for #link2 - dynamically created eventlistener
alert(elem.onclick); // null
alert(elem.hasAttribute('onclick')); // false
alert(elem.click); // function click(){[native code]} // btw, what's this?
[jsFiddle di sini](https://jsfiddle.net/qv0k7Lor/). Jika anda klik "Tambahkan event onclick untuk 2" dan kemudian "[link 2]", peristiwa kebakaran baik, tapi "Test link 2" selalu laporan palsu. Ada yang bisa bantu?
66
14
Tidak ada cara untuk memeriksa apakah secara dinamis terpasang acara pendengar ada atau tidak.
Satu-satunya cara anda dapat melihat jika pendengar acara terpasang adalah dengan melampirkan pendengar event seperti ini:
Anda kemudian dapat menguji apakah suatu peristiwa pendengar yang melekat pada
onclick
dengan kembali!!elem.onclick
(atau sesuatu yang serupa).Saya melakukan hal seperti itu:
Membuat atribut khusus untuk sebuah elemen ketika pendengar yang terpasang dan kemudian memeriksa jika ada.
Apa yang akan saya lakukan adalah membuat sebuah Boolean luar fungsi yang mulai keluar sebagai PALSU dan akan diatur untuk BENAR ketika anda melampirkan acara. Ini akan berfungsi sebagai semacam bendera untuk anda sebelum anda memasang acara lagi. Berikut ini's contoh ide.
tl;dr: Tidak, anda tidak dapat melakukan hal ini dalam setiap native didukung jalan.
Satu-satunya cara yang saya tahu untuk mencapai hal ini akan membuat kustom bagasi objek di mana anda menyimpan catatan dari pendengar menambahkan. Sesuatu di sepanjang baris berikut:
Langkah 1: Pertama, anda akan membutuhkan sebuah fungsi yang dapat melintasi penyimpanan objek dan kembali catatan dari sebuah elemen diberi elemen (atau palsu).
Langkah 2: Kemudian, anda akan membutuhkan sebuah fungsi yang dapat menambahkan event listener tapi juga menyisipkan pendengar untuk penyimpanan objek.
Langkah 3: sehubungan dengan kebutuhan yang sebenarnya dari pertanyaan anda, anda akan memerlukan berikut fungsi untuk memeriksa apakah suatu elemen telah menambahkan event listener untuk event tertentu.
Langkah 4: Akhirnya, anda akan membutuhkan sebuah fungsi yang dapat menghapus pendengar dari penyimpanan objek.
Cuplikan:
Although lebih dari 5 tahun telah berlalu sejak OP memposting pertanyaan, saya percaya orang-orang yang tersandung itu di masa depan akan mendapatkan keuntungan dari jawaban ini, sehingga merasa bebas untuk membuat saran atau perbaikan untuk itu. 😊
Anda bisa mengeceknya secara manual jika anda EventListener ada yang menggunakan Chrome inspektur misalnya. Dalam Elemen tab yang anda miliki tradisional "Gaya" subtab dan dekat satu sama lain : "Pendengar Event". Yang akan memberikan anda daftar semua EventListeners dengan unsur-unsur terkait.
Mungkin duplikat: https://stackoverflow.com/questions/28056716/check-if-an-element-has-event-listener-on-it-no-jquery/41137585. Silakan temukan jawaban saya di sana.
Pada dasarnya di sini adalah trik untuk Kromium (Krom) browser:
Berikut ini's sebuah script yang saya digunakan untuk memeriksa keberadaan dinamis yang terpasang acara pendengar. Saya menggunakan jQuery untuk memasang event handler untuk sebuah elemen, yang kemudian memicu peristiwa itu (dalam hal ini 'klik' event). Cara ini saya dapat mengambil dan menangkap acara sifat yang hanya akan ada jika event handler terpasang.
Tampaknya aneh bahwa metode ini doesn't ada. Apakah sudah waktunya untuk menambahkan ini akhirnya?
Jika anda ingin anda bisa sesuatu seperti berikut (belum teruji):
Hanya menghapus acara sebelum menambahkannya :
Aku hanya menulis sebuah script yang memungkinkan anda mencapai hal ini. Ini memberi anda dua fungsi global:
hasEvent(Node elm, String acara)
dangetEvents(Node elm)
yang dapat anda memanfaatkan. Diketahui bahwa ia memodifikasiEventTarget
metode prototypeadd/RemoveEventListener
, dan tidak bekerja untuk acara yang ditambahkan melalui markup HTML atau javascript sintakselm.on_event = ...
Info lebih lanjut di GitHub
[Live Demo][2]
Script:
Ada doesn't muncul untuk menjadi browser lintas fungsi yang akan mencari acara yang terdaftar dalam suatu elemen.
Namun, adalah mungkin untuk melihat memanggil kembali fungsi untuk unsur-unsur di beberapa browser menggunakan alat-alat pengembangan. Hal ini dapat berguna ketika mencoba untuk menentukan bagaimana halaman web fungsi atau kode debugging.
Firefox
Pertama, melihat elemen dalam Inspektur tab dalam alat pengembang. Hal ini dapat dilakukan dengan:
Jika ada peristiwa yang didaftarkan ke elemen, anda akan melihat tombol yang berisi kata Acara di samping elemen. Mengklik itu akan memungkinkan anda untuk melihat peristiwa-peristiwa yang telah terdaftar dengan elemen. Mengklik tanda panah di samping sebuah acara yang memungkinkan anda untuk melihat fungsi callback untuk itu.
Chrome
Pertama, melihat unsur Unsur tab dalam alat pengembang. Hal ini dapat dilakukan dengan:
Di bagian jendela yang menunjukkan pohon yang mengandung elemen-elemen halaman web, harus ada bagian lain dengan tab yang berjudul "Pendengar Event". Pilih untuk melihat peristiwa yang didaftarkan ke elemen. Untuk melihat kode untuk acara tertentu, klik link di sebelah kanan itu.
Di Chrome, acara untuk sebuah elemen juga dapat ditemukan dengan menggunakan getEventListeners fungsi. Namun, berdasarkan tes, getEventListeners fungsi doesn't daftar peristiwa ketika beberapa elemen yang melewati itu. Jika anda ingin menemukan semua elemen pada halaman yang memiliki pendengar dan melihat fungsi callback untuk orang-orang pendengar, anda dapat menggunakan kode berikut pada console untuk melakukan hal ini:
Jika saya memahami dengan baik anda hanya dapat memeriksa jika pendengar telah diperiksa tetapi tidak yang pendengar adalah presenter khusus.
Sehingga beberapa ad hoc kode akan mengisi celah untuk menangani coding aliran. Metode praktis akan membuat sebuah
negara
menggunakan variabel. Misalnya, melampirkan pendengar's checker sebagai berikut:maka jika anda menetapkan pendengar hanya mengubah nilai:
kemudian dalam eventListener 's callback anda dapat menetapkan fungsi tertentu di dalam dan di dalam cara yang sama, mendistribusikan akses ke fungsi tergantung dari beberapa negara sebagai variabel misalnya:
Anda bisa secara teori kuda-kudaan addEventListener dan removeEventListener untuk menambah memindahkan bendera ke 'ini' objek. Jelek dan saya belum't diuji ...
Aku hanya menemukan ini dengan mencoba untuk melihat apakah saya acara yang terpasang....
jika anda lakukan :
itu akan kembali "null"
tapi jika anda lakukan:
maka itu adalah "BENAR"
jadi saya berpikir bahwa ketika anda menggunakan "addEventListener" untuk menambahkan event handler, satu-satunya cara untuk mengaksesnya adalah melalui "hasOwnProperty". Aku berharap aku tahu mengapa atau bagaimana tapi sayangnya, setelah meneliti, saya belum't menemukan penjelasan.