Bagaimana cara menghapus semua event handler klik menggunakan jQuery?

121

Saya mengalami masalah. Pada dasarnya, ketika pengguna mengklik link 'Edit' pada halaman, kode Jquery berikut berjalan:

$("#saveBtn").click(function () {
    saveQuestion(id);
});

Dengan melakukan ini, event onClick dari tombol simpan memanggil saveQuestion()metode dan meneruskan ID pertanyaan yang tautan 'Edit' -nya diklik.

Namun jika dalam sesi yang sama pengguna mengklik edit pada 2 pertanyaan, lalu alih-alih menimpa clickevent handler sebelumnya , itu malah menyebabkan 2 event handler berjalan, satu mungkin memanggil saveQuestion(1)dan yang lainnya mungkin memanggil saveQuestion(2). Dengan melakukan ini, 1 pertanyaan menimpa yang lain.

Apakah ada cara untuk menghapus semua clickkejadian sebelumnya yang telah ditetapkan ke sebuah tombol?

javascript jquery click Klik Suka
sumber

Jawaban:

203

Anda akan menggunakan off () untuk menghapus acara seperti ini:

$("#saveBtn").off("click");

tetapi ini akan menghapus semua peristiwa klik yang terikat ke elemen ini. Jika fungsi dengan SaveQuestion adalah satu-satunya kejadian yang terikat maka hal di atas akan melakukannya. Jika tidak lakukan hal berikut:

$("#saveBtn").off("click").click(function() { saveQuestion(id); });
TStamper
sumber
31
Sejak jQuery 1.7, Anda harus menggunakan dan mematikan daripada mengikat dan melepaskan
Ralph Jansen
@LockTar dapatkah Anda menyarankan bagaimana ini seharusnya ditulis?
John Magnolia
@JohnMagnolia Lihat perubahan saya di atas.
Ralph Jansen
1
.addAttr ('onclick'); atau .removeAttr ('onclick');
Aliti
13

Adakah cara untuk menghapus semua peristiwa klik sebelumnya yang telah ditetapkan ke tombol?

$('#saveBtn').unbind('click').click(function(){saveQuestion(id)});
Rafael
sumber
unbind()tidak digunakan lagi sejak jQuery 3.0, dan penggunaan off()telah didorong sejak 1.7.
Skylar Ittner
7 
$('#saveBtn').off('click').click(function(){saveQuestion(id)});
Fo Nko
sumber
2

Jika Anda menggunakan ...

$(function(){
    function myFunc() {
        // ... do something ...
    };
    $('#saveBtn').click(myFunc);
});

... maka akan lebih mudah untuk melepas ikatan nanti.

Jarrett Meyer
sumber
1
Bagaimana menurutmu? Tidak peduli bagaimana sebuah event elemen terikat, mereka selalu bisa dilepas dengan cara yang sama ... $ ('# saveBtn'). Unbind ('apapun event (s)'); Nah, untuk RE-BIND… ya, teknik Anda mungkin lebih mudah dalam keadaan tertentu.
KyleFarris
1
Jika Anda melepaskan semua peristiwa klik, tidak ada bedanya. Tetapi jika Anda hanya ingin melepaskan satu tindakan tertentu, saya tidak ingin menulis ulang peristiwa itu di dua tempat. Dan seperti yang Anda katakan, jika saya ingin me-rebind nanti, sekali lagi itu lebih mudah dilakukan, karena saya tidak perlu menulis fungsinya untuk ketiga kalinya.
Jarrett Meyer
0 
$('#saveBtn').off('click').on('click',function(){
   saveQuestion(id)
});

Gunakan jquery yang off dan on

Ninjaneer
sumber