jquery memadam acara terikat

Dalam pembangunan web, kami biasanya menggunakan jQuery untuk mengikat pengendali acara, supaya pelbagai interaksi pengguna boleh dikendalikan dengan lebih cekap dan fleksibel. Walau bagaimanapun, dalam beberapa kes, kita perlu mengalih keluar atau memadamkan peristiwa terikat, seperti apabila elemen DOM dipadamkan atau apabila keadaan berubah dan pengikatan peristiwa perlu diubah. Jadi, bagaimana untuk memadamkan acara yang sudah terikat dalam jQuery? Artikel ini akan memperkenalkan beberapa kaedah dan teknik biasa untuk membantu anda mengendalikan pengikatan dan pengalihan keluar acara dengan lebih baik.

1 Gunakan kaedah unbind()

jQuery menyediakan kaedah yang dipanggil unbind() khusus untuk acara unbinding. Kaedah ini boleh mengalih keluar satu atau lebih pengendali acara daripada elemen atau mengalih keluar semua pengendali acara daripada ruang nama. Sintaks kaedah

unbind() adalah seperti berikut:

$(selector).unbind(event,[callback])

Antaranya, pemilih mewakili pemilih elemen yang perlu memadamkan acara, acara mewakili jenis acara yang akan dikeluarkan, dan panggil balik Mewakili nama fungsi pengendali acara yang akan diketepikan. Jika panggilan balik diabaikan, semua pengendali untuk jenis acara tertentu yang terikat pada elemen akan diketepikan.

Sebagai contoh, kod berikut boleh mengalih keluar semua pengendali acara klik:

//解绑定所有click事件
$("#myButton").unbind("click");

Jika anda perlu menyahikat pengendali acara tertentu, anda boleh menentukan nama fungsi untuk dinyahikat, contohnya:

//移除指定的事件处理程序
function myClickHandler() {
    alert("按钮被点击了");
}
$("#myButton").bind("click", myClickHandler);
//解绑定某个特定的事件处理程序
$("#myButton").unbind("click", myClickHandler);

2. Gunakan kaedah off()

Selain kaedah unbind(), jQuery juga menyediakan kaedah unbinding acara yang lebih fleksibel dipanggil off(). Berbanding dengan kaedah unbind(), kaedah off() membolehkan anda menyahikat berbilang pengendali acara sesuatu elemen dan menyokong senario pengikatan peristiwa yang lebih kompleks. Sintaks kaedah

off() adalah seperti berikut:

$(selector).off(event,[selector],[callback])

Antaranya, pemilih mewakili pemilih elemen yang perlu memadamkan acara, acara mewakili jenis acara yang akan dikeluarkan, pemilih Menunjukkan pemilih elemen kanak-kanak yang akan dikeluarkan, dan panggil balik menunjukkan nama fungsi pengendali acara yang akan dikeluarkan. Jika pemilih dan panggil balik diabaikan, semua pengendali untuk jenis acara tertentu yang terikat pada elemen akan dialih keluar.

Sebagai contoh, kod berikut boleh mengalih keluar pengendali untuk semua acara klik dan semua acara klik pada elemen anak:

//解除绑定所有click事件
$("#myButton").off("click");
//解除绑定子元素上的click事件
$("#myDiv").off("click", "button");

Adalah penting untuk ambil perhatian bahawa jika pengendali acara telah ditakrifkan menggunakan ruang nama , anda boleh menggunakan kaedah off() untuk mengetepikan pengendali acara dalam berbilang ruang nama pada masa yang sama, seperti yang ditunjukkan dalam contoh berikut:

//指定多个命名空间解除事件处理程序
$("#myButton").off("click.myNamespace1.myNamespace2");

3. Gunakan kaedah one()

Jika anda ingin Untuk mengalih keluar pengendali acara secara automatik selepas mencetuskan sekali, anda boleh menggunakan kaedah one(). Kaedah one() adalah serupa dengan kaedah bind(), kecuali peristiwa terikat hanya akan dicetuskan sekali. Sintaks kaedah

one() adalah seperti berikut:

$(selector).one(event,[data],[callback])

Antaranya, pemilih mewakili pemilih elemen yang mana peristiwa itu perlu diikat, acara mewakili jenis acara yang akan diikat , dan data mewakili Data tambahan pilihan untuk pengendali acara, panggil balik mewakili nama fungsi pengendali acara yang akan diikat.

Sebagai contoh, kod berikut boleh mengikat pengendali acara klik yang dilaksanakan sekali sahaja:

//绑定仅执行一次的click事件处理程序
$("#myButton").one("click", function() {
    alert("按钮被点击了");
});

Dalam kod ini, fungsi alert() hanya akan dilaksanakan apabila butang diklik Sekali , maka acara itu tidak akan dibalas lagi.

4. Gunakan kaedah unelegate()

Dalam versi terdahulu jQuery, kami biasanya menggunakan kaedah delegate() untuk mengikat pengendali acara. Kaedah ini menerima parameter pemilih untuk menentukan elemen sasaran pengendali acara, yang membenarkan kawalan yang lebih fleksibel bagi pengikatan acara.

Dengan pembangunan jquery, kaedah delegate() digantikan secara beransur-ansur dengan kaedah on(). Oleh itu, selepas versi jquery1.7, kita perlu menggunakan kaedah undelgate() untuk menyahikat peristiwa menggunakan kaedah delegate(). Sintaks kaedah

unelegate() adalah seperti berikut:

$(selector).undelegate([selector],[event],[callback])

Antaranya, pemilih mewakili pemilih elemen yang mana peristiwa itu perlu dinyahikat, acara mewakili jenis acara untuk tidak terikat , dan panggil balik mewakili acara yang tidak terikat Nama fungsi pengendali acara yang ditentukan. Jika panggilan balik diabaikan, semua pengendali untuk jenis acara tertentu yang terikat pada elemen akan diketepikan.

Sebagai contoh, kod berikut boleh mengalih keluar semua pengendali acara klik yang terikat menggunakan kaedah delegate():

//解除绑定所有click事件
$("#myElement").undelegate("button", "click");

Dalam kod ini, kaedah undelegate() bukan sahaja mengalih keluar semua Pengendali acara klik pada elemen butang juga mengalih keluar semua pengendali acara klik pada elemen myElement.

Ringkasan:

Dalam proses menggunakan jQuery untuk mengikat pengendali acara, acara perlu ditambah dan dialih keluar dengan kerap, dan acara tidak terikat boleh dinyahikat(), off( ), one() , unelegate() dan kaedah lain untuk dilaksanakan. Terutamanya dalam operasi DOM yang kompleks, pengikatan dan penyingkiran peristiwa yang betul boleh meningkatkan kebolehselenggaraan dan kebolehskalaan aplikasi web dengan banyak. Oleh itu, menguasai teknik pemecatan acara biasa ini akan membantu anda membangunkan aplikasi Web dengan lebih cekap.

Atas ialah kandungan terperinci jquery memadam acara terikat. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!