Mengapa Pendengar Acara Saya Mencetuskan Fungsi Serta-merta?

Pendengar Acara: Misteri Panggilan Fungsi Tidak Digesa

Apabila bekerja dengan pendengar acara, seseorang mungkin menghadapi tingkah laku yang membingungkan: menambahkan pendengar acara dengan rujukan fungsi luaran nampaknya untuk menggunakan fungsi dengan segera, walaupun tanpa mengklik pada elemen. Ini boleh mengecewakan dan membawa kepada tingkah laku yang tidak dijangka.

Pertimbangkan coretan HTML berikut:

<span>

Untuk menambah acara klik, seseorang mungkin menggunakan kaedah addEventListener:

first.addEventListener('click', function() {
  alert('sup!');
})

Kod ini berfungsi seperti yang diharapkan, mencetuskan amaran apabila "Pautan Pertama" diklik. Walau bagaimanapun, apabila menggunakan fungsi luaran sebagai hujah kedua:

function message_me(m_text) {
    alert(m_text)
}

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

Fungsi message_me digunakan serta-merta, menghasilkan mesej amaran walaupun sebelum "Pautan Kedua" diklik.

Kepada menyelesaikan isu ini, seseorang perlu memahami bahawa parameter kedua addEventListener menjangkakan rujukan fungsi. Dalam kod bermasalah, fungsi sedang digunakan secara langsung dan hasilnya dihantar ke addEventListener. Sebaliknya, sama ada fungsi tanpa nama harus digunakan sebagai argumen kedua atau fungsi luaran harus diubah suai untuk mengembalikan fungsi.

Sebagai contoh, kita boleh menggunakan fungsi tanpa nama dalam addEventListener:

function message_me(m_text) {
    alert(m_text)
} 

second.addEventListener('click', 
    function() {
        message_me('shazam');
    }
);

Dengan menyediakan rujukan fungsi dalam fungsi tanpa nama, kami memastikan bahawa fungsi message_me hanya digunakan apabila "Pautan Kedua" diklik.

Atas ialah kandungan terperinci Mengapa Pendengar Acara Saya Mencetuskan Fungsi Serta-merta?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!