Bolehkah berbilang kawalan jquery mengikat acara?

Dalam pembangunan web, selalunya perlu untuk mengikat acara yang sama kepada berbilang kawalan untuk mencapai fungsi yang sama Contohnya, mengklik berbilang butang akan mencetuskan acara yang sama. jQuery boleh melaksanakan fungsi ini dengan sangat mudah Mari kita perkenalkan secara terperinci cara menggunakan jQuery untuk mengikat acara yang sama kepada berbilang kawalan.

1. Ikat satu peristiwa kawalan

Untuk mengikat acara kepada kawalan dalam jQuery, anda boleh menggunakan kod berikut:

$(selector).bind(eventType, handler);

di mana pemilih bermaksud Pemilih kawalan untuk mengikat acara, eventType mewakili jenis acara yang akan diikat, dan pengendali mewakili fungsi pemprosesan acara. Sebagai contoh, kod berikut mengikat acara klik pada butang dengan id btn:

$('#btn').bind('click', function() {
  alert('按钮被点击了！');
});

2. Ikat berbilang peristiwa kawalan

Dalam pembangunan sebenar, selalunya perlu Ikat peristiwa yang sama kepada berbilang kawalan. Jika anda menggunakan kod di atas untuk mengikat acara pada setiap kawalan, ia akan menjadi sangat menyusahkan. Untuk memudahkan kod, anda boleh menggunakan kaedah yang disediakan oleh jQuery untuk mengikat acara kepada berbilang kawalan pada masa yang sama.

$(selector1, selector2, ..., selectorN).bind(eventType, handler);

Antaranya, berbilang pemilih yang dipisahkan dengan koma mewakili berbilang kawalan kepada peristiwa yang terikat Maksud eventType dan pengendali adalah sama seperti mengikat acara kepada satu kawalan. Contohnya, kod berikut mengikat acara klik pada tiga butang dengan ID btn1, btn2 dan btn3:

$('#btn1, #btn2, #btn3').bind('click', function() {
  alert('按钮被点击了！');
});

3. Gunakan kaedah on untuk mengikat acara

Selepas jQuery 1.7, adalah disyorkan untuk menggunakan kaedah on untuk mengikat peristiwa. Penggunaan kaedah on adalah serupa dengan kaedah bind, tetapi sintaksnya berbeza sedikit. Anda juga boleh menggunakan kaedah on untuk mengikat acara yang sama kepada berbilang kawalan pada masa yang sama.

$(selector1, selector2, ..., selectorN).on(eventType, handler);

Sebagai contoh, kod berikut mengikat acara klik pada semua butang dengan kelas btn:

$('.btn').on('click', function() {
  alert('按钮被点击了！');
});

4. Nyahikat acara

Jika anda tidak lagi memerlukan peristiwa kawalan, anda boleh menggunakan kaedah unbind atau off method yang disediakan oleh jQuery untuk menyahikatnya.

$(selector).unbind(eventType, handler);
$(selector).off(eventType, handler);

Antaranya, pemilih mewakili pemilih kawalan untuk menyahikat acara, eventType mewakili jenis acara yang akan dinyahikat dan pengendali mewakili fungsi pemprosesan acara. Contohnya, kod berikut menyahaktifkan acara klik butang dengan id btn:

$('#btn').unbind('click');
$('#btn').off('click');

5. Nota

Apabila mengikat acara yang sama kepada berbilang kawalan, anda perlu Beri perhatian kepada isu berikut:

• Jika fungsi pengendalian acara perlu menggunakan beberapa sifat atau nilai kawalan, maka anda perlu menggunakan kata kunci ini untuk mendapatkan sifat atau nilai kawalan semasa.
• Jika fungsi pengendalian acara terikat kepada berbilang kawalan adalah sama, anda boleh menentukan fungsi pengendalian acara sebagai fungsi awam, dan kemudian masukkan nama fungsi apabila memanggil acara terikat.
• Jika fungsi pengendalian peristiwa yang berbeza terikat pada kawalan yang sama pada masa yang sama, semua fungsi pengendalian peristiwa perlu dilepaskan apabila menyahikat.

Di atas ialah pengenalan terperinci untuk menggunakan jQuery untuk mengikat acara yang sama kepada berbilang kawalan. Apabila anda menghadapi situasi di mana anda perlu mengikat peristiwa yang sama kepada berbilang kawalan, anda boleh memilih kaedah yang sesuai untuk mengikat dan menyahikat mengikut keperluan sebenar.

Atas ialah kandungan terperinci Bolehkah berbilang kawalan jquery mengikat acara?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!