จะลบ“ onclick” ด้วย JQuery ได้อย่างไร?


100

รหัส PHP:

<a id="a$id" onclick="check($id,1)" href="javascript:void(0)"  class="black">Qualify</a>

ฉันต้องการลบonclick="check($id,1)ลิงก์เพื่อไม่ให้คลิกลิงก์หรือ " check($id,1)ไม่สามารถเริ่มทำงานได้ฉันจะทำอย่างไรกับ JQuery?

คำตอบ:


239

ทางเก่า (ก่อน 1.7):

$("...").attr("onclick", "").unbind("click");

วิธีใหม่ (1.7+):

$("...").prop("onclick", null).off("click");

(แทนที่ ... ด้วยตัวเลือกที่คุณต้องการ)


26
สิ่งนั้นไม่ควรถูก removeAttr ('onclick')?
Roatin Marth

ใช่ประเด็นดีอาจจะสะอาดกว่า แต่ฉันไม่แน่ใจว่ามันจะแตกต่างจากมุมมองของการดำเนินการ
glmxndr

6
ด้วย jQuery 1.7+ คุณสามารถใช้เปิด / ปิด: stackoverflow.com/questions/209029/…
Lance Cleveland

6
ดูความคิดเห็นแรกบนremoveAttr api.jquery.com/removeattr Removing an inline onclick event handler using .removeAttr() doesn't achieve the desired effect in Internet Explorer 6, 7, or 8. To avoid potential problems, use .prop() instead
andyface

2
@andyface ใช่ที่อยู่ในเอกสาร แต่ฉันต้องใช้.prop()สำหรับ IE11 ด้วย
onetwo12

58

ฉันรู้ว่ามันค่อนข้างเก่า แต่เมื่อคนแปลกหน้าหลงทางพบคำถามนี้เพื่อหาคำตอบ (เหมือนที่ฉันทำ) นี่เป็นวิธีที่ดีที่สุดที่จะทำแทนที่จะใช้ removeAttr ():

$element.prop("onclick", null);

อ้างถึงdoku อย่างเป็นทางการของ jQuerys :

"การลบตัวจัดการเหตุการณ์ onclick แบบอินไลน์โดยใช้. removeAttr () ไม่บรรลุผลตามที่ต้องการใน Internet Explorer 6, 7 หรือ 8 เพื่อหลีกเลี่ยงปัญหาที่อาจเกิดขึ้นให้ใช้. prop () แทน"


1
ฉันพบว่านี่เป็นวิธีที่ดีที่สุดในการลบเหตุการณ์ onlick เมื่อคุณพิมพ์แบบนี้ <span onlick="method()">sometext>/span>งานนี้ไม่มีการผูกมัดอย่างสมบูรณ์และใช้งานได้ดี
zdarsky.peter

3
ฉันไม่คิดว่านี่เป็นวิธีที่ดีที่สุด jsfiddle.net/TN2wr vs jsfiddle.net/TN2wr/1
กัส

ฉันใช้ JQ ที่เก่ากว่า 1.6 ดังนั้น $ (element) .attr ('onclick', null); เหมาะกับฉัน
metamagikum

18

กำลังลบ onclickคุณสมบัติ

สมมติว่าคุณเพิ่มเหตุการณ์คลิกของคุณในบรรทัดดังนี้:

<button id="myButton" onclick="alert('test')">Married</button>

จากนั้นคุณสามารถลบเหตุการณ์ในลักษณะนี้:

$("#myButton").prop('onclick', null); // Removes 'onclick' property if found

การลบclickผู้ฟังเหตุการณ์

สมมติว่าคุณเพิ่มเหตุการณ์การคลิกโดยกำหนดตัวฟังเหตุการณ์ดังนี้:

$("button").on("click", function() { alert("clicked!"); });

... หรือแบบนี้:

$("button").click(function() { alert("clicked!"); });

จากนั้นคุณสามารถลบเหตุการณ์ในลักษณะนี้:

$("#myButton").off('click');          // Removes other events if found

กำลังลบทั้งสองอย่าง

หากคุณไม่แน่ใจว่ามีการเพิ่มกิจกรรมของคุณอย่างไรคุณสามารถรวมทั้งสองอย่างได้ดังนี้:

$("#myButton").prop('onclick', null)  // Removes 'onclick' property if found
              .off('click');          // Removes other events if found



5

หลังจากพยายามอย่างหนักกับการผูก, เลิกผูก, เปิด, ปิด, คลิก, attr, removeAttr, prop ฉันทำให้มันใช้งานได้ ดังนั้นฉันมีสถานการณ์ต่อไปนี้: ใน html ของฉันฉันไม่ได้แนบตัวจัดการ onclick แบบอินไลน์ใด ๆ

จากนั้นใน Javascript ของฉันฉันใช้สิ่งต่อไปนี้เพื่อเพิ่มตัวจัดการ onclick แบบอินไลน์:

$(element).attr('onclick','myFunction()');

ในการลบสิ่งนี้ในภายหลังจาก Javascript ฉันใช้สิ่งต่อไปนี้:

$(element).prop('onclick',null);

นี่เป็นวิธีที่ใช้ได้ผลสำหรับฉันในการเชื่อมโยงและเลิกเชื่อมเหตุการณ์การคลิกแบบ dinamically ใน Javascript อย่าลืมแทรกตัวจัดการ onclick แบบอินไลน์ในองค์ประกอบของคุณ


ฉันชอบสิ่งนี้ แต่ทำไมคนนั้นถึงเป็นเสาและอีกอัน?
Stachu

ฉันไม่แน่ใจ แต่วิธีที่ฉันเห็นคือเมื่อใช้ attr คุณเพิ่ม / ฉีด onclick handler ด้วย myFunction () ที่สอดคล้องกันและ prop ('onclick', null) จะลบแอตทริบิวต์ดังนั้นจะไม่มีการเรียกใช้ฟังก์ชัน นี่คือวิธีที่ได้ผลสำหรับฉัน และฉันสังเกตได้ว่าองค์ประกอบมีตัวจัดการ onclick ผ่าน attr อย่างไรและจะลบออกอย่างไรหลังจาก prop
bboydflo

1
สำหรับการอ้างอิงในอนาคตคุณจริงๆควรจะใช้.on('click', myFunction)(ทราบว่าmyFunctionเป็นไม่ได้ในเครื่องหมายคำพูด) แล้วต่อมา.off('click')
JDB ยังจำโมนิกา

1

จะเกิดอะไรขึ้นถ้าเหตุการณ์ onclick ไม่ได้อยู่บนองค์ประกอบโดยตรง แต่มาจากองค์ประกอบหลัก สิ่งนี้ควรใช้งานได้:

$(".noclick").attr('onclick','').unbind('click');
$(".noclick").click(function(e){
    e.preventDefault();
    e.stopPropagation();
    return false;
});

การเพิ่ม click-listener อื่น (เพื่อป้องกันไม่ให้ค่า default เป็นต้น) อาจเพิ่มไว้ที่ส่วนท้ายของ Listener list และทำให้ Listener อื่น ๆ ยังคงถูกเรียกใช้งานก่อน ฉันไม่แน่ใจว่าจะถูกเพิ่มก่อนหรือสุดท้ายในรายการ อย่างไรก็ตามจะดีกว่าถ้าใช้ 'off' ตามที่เห็นในคำตอบอื่น ๆ
Frederic Leitenberger

0

ลองใช้วิธีนี้หากคุณเลิกผูกเหตุการณ์ onclick ด้วย ID จากนั้นใช้:

$('#youLinkID').attr('onclick','').unbind('click');

ลองใช้วิธีนี้หากคุณเลิกผูกเหตุการณ์ onclick ตามชั้นเรียนแล้วใช้:

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