Mengapakah `addEventListener` JavaScript saya menyala pada pemuatan halaman dan bukannya pada klik?

DDD
Lepaskan: 2024-10-30 02:57:28
asal
763 orang telah melayarinya

Why is my JavaScript `addEventListener` firing on page load instead of on click?

JavaScript "addEventListener" Event Firing on Page Load

Isu ini timbul apabila pendengar acara dilampirkan secara tidak betul, khususnya dalam coretan kod yang disediakan . Berikut ialah penjelasan dan penyelesaian:

Dalam kod yang disediakan, pendengar acara untuk acara "klik" dilampirkan pada elemen div yang baru dibuat dengan id "myDiv":

<code class="javascript">el = document.getElementById("myDiv");
el.addEventListener("click", alert("clicktrack"), false);</code>
Salin selepas log masuk

Walau bagaimanapun, isu ini terletak dalam fungsi panggil balik pendengar acara, yang merupakan pernyataan amaran yang dibalut dengan rentetan:

<code class="javascript">alert("clicktrack")</code>
Salin selepas log masuk

Kod ini cuba untuk melaksanakan pernyataan amaran serta-merta apabila pendengar acara dilampirkan. Memandangkan pendengar acara didaftarkan semasa penghuraian dan pelaksanaan DOM, makluman akan dipanggil apabila halaman dimuatkan, bukan apabila elemen diklik.

Untuk menyelesaikan masalah ini, kod harus membalut pernyataan amaran dalam fungsi tanpa nama, yang boleh dihantar kepada pendengar acara:

<code class="javascript">el.addEventListener("click", function() { alert("clicktrack"); }, false);</code>
Salin selepas log masuk

Dengan pengubahsuaian ini, makluman hanya akan dilaksanakan apabila elemen "myDiv" menerima acara "klik", seperti yang dimaksudkan.

Atas ialah kandungan terperinci Mengapakah `addEventListener` JavaScript saya menyala pada pemuatan halaman dan bukannya pada klik?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan
Tentang kita Penafian Sitemap
Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!