Rumah >hujung hadapan web >tutorial js >Mengapakah `addEventListener` Memanggil Fungsi Saya Serta-merta dan bukannya pada Pencetus Peristiwa?

Mengapakah `addEventListener` Memanggil Fungsi Saya Serta-merta dan bukannya pada Pencetus Peristiwa?

Linda Hamilton
Linda Hamiltonasal
2024-12-13 15:16:10591semak imbas

Why Does `addEventListener` Call My Function Immediately Instead of on Event Trigger?

"addEventListener Memanggil Fungsi Tanpa Prompt" Diterangkan

Apabila melampirkan pendengar acara pada elemen, kami mahu fungsi itu dilaksanakan hanya apabila peristiwa itu berlaku. Tetapi dalam beberapa kes, mungkin sukar untuk memastikan fungsi itu tidak dipanggil lebih awal.

Pertimbangkan kod HTML berikut:

<span>

Kami ingin menambahkan acara klik pada pautan kedua:

second.addEventListener('click', message_me('shazam'));

di mana 'message_me' ialah fungsi luaran yang memaparkan mesej. Anehnya, kod ini mencetuskan fungsi 'message_me' serta-merta, walaupun sebelum kami mengklik pautan kedua.

Masalahnya

Isunya terletak pada cara JavaScript mengendalikan rujukan fungsi sebagai hujah kedua 'addEventListener'. JavaScript menjangkakan rujukan kepada fungsi, tetapi dalam kod yang bermasalah, fungsi 'message_me('shazam')' dipanggil serta-merta, dan hasilnya diluluskan sebaliknya.

Penyelesaian

Terdapat dua cara untuk menyelesaikan isu ini:

  • Buat tanpa nama fungsi: Balut 'message_me' dalam fungsi tanpa nama untuk mengembalikan rujukan fungsi:
second.addEventListener('click', function() {
    message_me('shazam');
});

Penyelesaian ini memastikan 'message_me' dipanggil hanya apabila pautan kedua diklik.

  • Kembalikan fungsi daripada 'message_me': Ubah suai 'message_me' untuk mengembalikan rujukan fungsi:
function message_me(m_text) {
    return function() {
        alert(m_text);
    };
}

second.addEventListener('click', message_me('shazam'));

Dalam kes ini, 'addEventListener' menerima rujukan kepada fungsi yang akan dilaksanakan apabila peristiwa klik berlaku.

Atas ialah kandungan terperinci Mengapakah `addEventListener` Memanggil Fungsi Saya Serta-merta dan bukannya pada Pencetus Peristiwa?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
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