จะลบตัวจัดการเหตุการณ์การคลิกทั้งหมดโดยใช้ jQuery ได้อย่างไร


121

ฉันมีปัญหา โดยทั่วไปเมื่อผู้ใช้คลิกลิงก์ 'แก้ไข' บนเพจโค้ด Jquery ต่อไปนี้จะทำงาน:

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

เมื่อทำเช่นนี้เหตุการณ์ onClick ของปุ่มบันทึกจะเรียกใช้saveQuestion()เมธอดและส่งผ่าน ID ของคำถามที่คลิกลิงก์ "แก้ไข"

แต่หากในช่วงเดียวกันผู้ใช้คลิกแก้ไขเมื่อวันที่ 2 คำถามแล้วแทนการเขียนทับก่อนหน้าclickจัดการเหตุการณ์มันแทนที่จะทำให้เกิด 2 ตัวจัดการเหตุการณ์ในการทำงานอย่างใดอย่างหนึ่งซึ่งอาจจะเรียก และสายอื่นsaveQuestion(1) ๆ ที่อาจจะ saveQuestion(2)การทำ 1 คำถามนี้จะเขียนทับอีกคำถาม

มีวิธีลบclickเหตุการณ์ก่อนหน้าทั้งหมดที่ถูกกำหนดให้กับปุ่มหรือไม่?

คำตอบ:


203

คุณจะใช้off ()เพื่อลบเหตุการณ์ดังนี้:

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

แต่จะลบเหตุการณ์การคลิกทั้งหมดที่เชื่อมโยงกับองค์ประกอบนี้ หากฟังก์ชันที่มี SaveQuestion เป็นเพียงเหตุการณ์เดียวที่ถูกผูกไว้ข้างต้นจะทำเช่นนั้น หากไม่ดำเนินการดังต่อไปนี้:

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

31
ตั้งแต่ jQuery 1.7 คุณควรใช้เปิดและปิดแทนการผูกและคลาย
Ralph Jansen

@LockTar ช่วยแนะนำวิธีเขียนแทนได้ไหม
John Magnolia

@JohnMagnolia ดูการเปลี่ยนแปลงของฉันด้านบน
Ralph Jansen

1
.addAttr ( 'onclick'); หรือ. removeAttr ('onclick');
Aliti

13

มีวิธีลบเหตุการณ์การคลิกก่อนหน้าทั้งหมดที่กำหนดให้กับปุ่มหรือไม่?

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

unbind()เลิกใช้แล้วเมื่อ jQuery 3.0 และoff()ได้รับการสนับสนุนให้ใช้ตั้งแต่ 1.7
Skylar Ittner


2

ถ้าคุณใช้ ...

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

... แล้วจะง่ายกว่าในการเลิกผูกในภายหลัง


1
คุณคิดยังไง? ไม่ว่าเหตุการณ์ขององค์ประกอบจะถูกผูกไว้อย่างไรพวกเขาก็สามารถหลุดออกมาในลักษณะเดียวกันได้เสมอ ... $ ('# saveBtn'). unbind ('เหตุการณ์ใด ๆ '); ตอนนี้การผูกใหม่ ... ใช่เทคนิคของคุณอาจง่ายกว่าในบางสถานการณ์
KyleFarris

1
หากคุณเลิกผูกเหตุการณ์การคลิกทั้งหมดก็ไม่ต่างกัน แต่ถ้าคุณต้องการเลิกผูกการกระทำที่เฉพาะเจาะจงเพียงรายการเดียวฉันก็ไม่ต้องการเขียนเหตุการณ์นั้นซ้ำในสองที่ และอย่างที่คุณบอกถ้าฉันต้องการเชื่อมต่อในภายหลังมันง่ายกว่าที่จะทำอีกครั้งเพราะฉันไม่ต้องเขียนฟังก์ชันเป็นครั้งที่สาม
Jarrett Meyer

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.