Bagaimana untuk Mengikat Peristiwa Onclick kepada Elemen HTML yang Disisipkan Secara Dinamik dalam jQuery?

jQuery: Mengikat Peristiwa Onclick kepada Elemen HTML yang Disisipkan Secara Dinamik

Dalam jQuery, adalah mungkin untuk mengikat pengendali acara kepada elemen yang ditambahkan pada DOM selepas halaman dimuatkan. Walau bagaimanapun, beberapa kaedah yang digunakan sebelum ini, seperti .bind() dan .live(), telah ditamatkan. Artikel ini menerangkan cara untuk mengikat peristiwa onclick dengan betul kepada elemen yang ditambah secara dinamik menggunakan kaedah .on() yang dikemas kini.

Kod yang disediakan menunjukkan penambahan elemen pautan secara dinamik menggunakan kaedah .append() jQuery. Elemen ini mengandungi pendengar acara onclick yang terikat menggunakan kaedah .bind(). Walau bagaimanapun, pendengar acara tidak dicetuskan apabila pautan diklik.

Untuk menyelesaikan isu ini, gunakan kaedah .on() dan bukannya .bind(). .on() ialah kaedah yang lebih terkini yang digunakan untuk delegasi acara dan membenarkan pengendali acara terikat kepada elemen yang tidak terdapat dalam DOM pada masa pengendalian acara.

Kod yang betul untuk mengikat sesuatu acara onclick kepada elemen yang ditambahkan secara dinamik ialah:

$(document).on('click', 'selector-to-your-element', function() {
    // Code here ...
});

Dalam coretan kod ini, pemilih-ke-elemen-anda mewakili pemilih yang mengenal pasti elemen ditambah secara dinamik yang anda ingin mengikat acara itu. Apabila mana-mana elemen yang sepadan dengan pemilih ini diklik, kod di dalam pengendali acara akan dilaksanakan.

Dengan menggunakan .on() dengan cara ini, anda boleh memastikan acara onclick diikat dengan betul pada elemen yang ditambahkan pada DOM secara dinamik.

Atas ialah kandungan terperinci Bagaimana untuk Mengikat Peristiwa Onclick kepada Elemen HTML yang Disisipkan Secara Dinamik dalam jQuery?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!