Pertanyaan Cara terbaik untuk menghapus pengendali event di jQuery?


Saya punya input type="image". Ini bertindak seperti catatan sel di Microsoft Excel. Jika seseorang memasukkan nomor ke dalam kotak teks yang ini input-image dipasangkan dengan, saya mengatur event handler untuk input-image. Kemudian ketika pengguna mengklik image, mereka mendapatkan sedikit munculan untuk menambahkan beberapa catatan ke data.

Masalah saya adalah bahwa ketika pengguna memasukkan nol ke dalam kotak teks, saya perlu menonaktifkan input-imagepengendali event. Saya telah mencoba yang berikut, tetapi tidak berhasil.

$('#myimage').click(function { return false; });

969
2017-10-16 15:28


asal


Jawaban:


jQuery ≥ 1.7

Dengan jQuery 1.7 dan seterusnya API acara telah diperbarui, .bind()/.unbind() masih tersedia untuk kompatibilitas mundur, tetapi metode yang lebih disukai adalah menggunakan di()/mati() fungsi. Di bawah ini sekarang,

$('#myimage').click(function() { return false; }); // Adds another click event
$('#myimage').off('click');
$('#myimage').on('click.mynamespace', function() { /* Do stuff */ });
$('#myimage').off('click.mynamespace');

jQuery <1.7

Dalam kode contoh Anda, Anda cukup menambahkan peristiwa klik lain ke gambar, bukan menimpa yang sebelumnya:

$('#myimage').click(function() { return false; }); // Adds another click event

Kedua peristiwa klik akan dipecat.

Seperti yang dikatakan orang, Anda dapat menggunakan tidak mengikat untuk menghapus semua peristiwa klik:

$('#myimage').unbind('click');

Jika Anda ingin menambahkan satu peristiwa dan kemudian menghapusnya (tanpa menghapus yang lain yang mungkin telah ditambahkan), maka Anda dapat menggunakan ruang nama acara:

$('#myimage').bind('click.mynamespace', function() { /* Do stuff */ });

dan hanya menghapus acara Anda:

$('#myimage').unbind('click.mynamespace');

1494
2017-10-16 21:13



Ini tidak tersedia ketika pertanyaan ini dijawab, tetapi Anda juga dapat menggunakan hidup() metode untuk mengaktifkan / menonaktifkan acara.

$('#myimage:not(.disabled)').live('click', myclickevent);

$('#mydisablebutton').click( function () { $('#myimage').addClass('disabled'); });

Apa yang akan terjadi dengan kode ini adalah ketika Anda mengeklik #mydisablebutton, itu akan menambahkan kelas yang dinonaktifkan ke elemen #myimage. Ini akan membuatnya agar pemilih tidak lagi cocok dengan elemen dan acara tidak akan diaktifkan hingga kelas 'cacat' dihapus sehingga pemilih .live () kembali valid.

Ini memiliki manfaat lain dengan menambahkan gaya berdasarkan kelas itu juga.


59
2017-07-23 17:57



Ini dapat dilakukan dengan menggunakan fungsi yang tidak mengikat.

$('#myimage').unbind('click');

Anda dapat menambahkan beberapa penangan kejadian ke objek dan acara yang sama di jquery. Ini berarti menambahkan yang baru tidak menggantikan yang lama.

Ada beberapa strategi untuk mengubah penangan kejadian, seperti ruang nama acara. Ada beberapa halaman tentang ini di dokumen online.

Lihatlah pertanyaan ini (begitulah saya belajar tentang tidak mengikat). Ada beberapa deskripsi yang berguna tentang strategi ini dalam jawaban.

Cara membaca fungsi callback hover terikat di jquery


37
2017-10-16 15:35



Jika Anda ingin menanggapi suatu acara hanya sekali saja, sintaks berikut harus benar-benar membantu:

 $('.myLink').bind('click', function() {
   //do some things

   $(this).unbind('click', arguments.callee); //unbind *just this handler*
 });

Menggunakan arguments.callee, kita dapat memastikan bahwa satu handler fungsi anonim tertentu dihapus, dan dengan demikian, memiliki handler sekali waktu untuk suatu peristiwa tertentu. Semoga ini bisa membantu orang lain.


34
2017-08-05 07:29



mungkin metode yang tidak baik akan berhasil untuk Anda

$("#myimage").unbind("click");

29
2017-10-16 15:31



Saya harus mengatur acara ke nol menggunakan prop dan attr. Saya tidak bisa melakukannya dengan yang satu atau yang lain. Saya juga tidak bisa mendapatkan .bisa bekerja. Saya sedang mengerjakan elemen TD.

.prop("onclick", null).attr("onclick", null)

29
2018-03-28 14:44



Anda mungkin menambahkan onclick handler sebagai markup inline:

<input id="addreport" type="button" value="Add New Report" onclick="openAdd()" />

Jika demikian, jquery .off() atau .unbind() tidak akan berfungsi. Anda perlu menambahkan pengendali event asli di jquery juga:

$("#addreport").on("click", "", function (e) {
   openAdd();
});

Kemudian jquery memiliki referensi ke pengendali event dan dapat menghapusnya:

$("#addreport").off("click")

VoidKing menyebutkan ini sedikit lebih miring dalam komentar di atas.


10
2018-01-21 22:25



Jika acara terlampir cara ini, dan targetnya tidak terikat:

$('#container').on('click','span',function(eo){
    alert(1);

    $(this).off(); //seams easy, but does not work

    $('#container').off('click','span'); //clears click event for every span

    $(this).on("click",function(){return false;}); //this works.

});​

9
2018-06-26 13:02



Diperbarui untuk tahun 2014

Menggunakan jQuery versi terbaru, Anda sekarang dapat membatalkan semua acara pada ruang nama hanya dengan melakukan $( "#foo" ).off( ".myNamespace" );


9
2018-02-05 11:39



Terima kasih untuk informasi. sangat membantu saya menggunakannya untuk mengunci interaksi halaman saat dalam mode edit oleh pengguna lain. Saya menggunakannya bersamaan dengan ajaxComplete. Tidak perlu perilaku yang sama tetapi agak mirip.

function userPageLock(){
    $("body").bind("ajaxComplete.lockpage", function(){
        $("body").unbind("ajaxComplete.lockpage");
        executePageLock();      
    });
};  

function executePageLock(){
    //do something
}

6
2017-07-02 21:54



Cara terbaik untuk menghapus acara onclick inline adalah $(element).prop('onclick', null);


6
2018-01-02 14:43