Rumah > hujung hadapan web > tutorial js > Bagaimana untuk Mengikat Peristiwa Onclick Secara Dinamik ke Elemen HTML yang Ditambah dalam jQuery?

Bagaimana untuk Mengikat Peristiwa Onclick Secara Dinamik ke Elemen HTML yang Ditambah dalam jQuery?

Patricia Arquette
Lepaskan: 2024-11-10 21:41:03
asal
820 orang telah melayarinya

How to Dynamically Bind Onclick Events to Added HTML Elements in jQuery?

Pengikatan Dinamik Peristiwa Onclick untuk Elemen HTML Ditambah

Apabila menambahkan elemen pada halaman web secara dinamik menggunakan jQuery, adalah perlu untuk mengikat peristiwa klik sewajarnya untuk memastikan kefungsian yang betul. Walau bagaimanapun, kaedah lama seperti .bind() dan .live() tidak digunakan lagi. Sebaliknya, kaedah .on() harus digunakan.

Kaedah .on() mengambil tiga hujah: jenis acara (cth., 'klik'), pemilih yang mengenal pasti elemen yang sepatutnya acara itu terikat, dan fungsi panggil balik yang mengendalikan acara.

Contoh:

$(document).on('click', '.added-element', function() {
    alert('Hello from the binded event!');
});
Salin selepas log masuk

Dalam contoh ini, mana-mana elemen dengan kelas "elemen tambahan" akan mencetuskan makluman apabila diklik, tidak kira sama ada ia telah ditambahkan pada DOM secara dinamik.

Nota:

Kaedah .on() juga boleh digunakan untuk mengikat peristiwa untuk menambahkan elemen secara dinamik dalam bekas tertentu. Sebagai contoh, jika anda ingin mengikat acara klik pada semua elemen dalam div dengan ID "bekas", anda akan menggunakan kod berikut:

$('#container').on('click', '.added-element', function() {
    alert('Hello from the container!');
});
Salin selepas log masuk

Atas ialah kandungan terperinci Bagaimana untuk Mengikat Peristiwa Onclick Secara Dinamik ke Elemen HTML yang Ditambah dalam jQuery?. 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
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan