jQuery เทียบเท่ากับเมธอด addEventListener ของ JavaScript

ฉันพยายามค้นหา jQuery ที่เทียบเท่ากับการเรียกใช้เมธอด JavaScript นี้:

document.addEventListener('click', select_element, true);

ฉันได้รับเท่าที่:

$(document).click(select_element);

แต่นั่นก็ไม่ได้ผลเช่นเดียวกันกับพารามิเตอร์สุดท้ายของวิธีการจาวาสคริปต์ - บูลีนที่ระบุว่าควรจะดำเนินการตัวจัดการเหตุการณ์ในระยะการจับหรือการเดือด (ต่อความเข้าใจของฉันจากhttp://www.quirksmode.org /js/events_advanced.html ) - ถูกปล่อยออก

ฉันจะระบุพารามิเตอร์นั้นหรือใช้ฟังก์ชันเดียวกันโดยใช้ jQuery ได้อย่างไร

ไม่ใช่ทุกเบราว์เซอร์ที่สนับสนุนการจับภาพเหตุการณ์ (ตัวอย่างเช่นรุ่นของ Internet Explorer ที่น้อยกว่า 9 ไม่ได้) แต่ทุกตัวรองรับการทำ bubbling ของเหตุการณ์

สิ่งที่คุณกำลังมองหาใน jQuery ใกล้เคียงที่สุดคือใช้bind()(แทนที่โดยon()jQuery 1.7+) หรือเมธอด jQuery เฉพาะเหตุการณ์ (ในกรณีนี้click()ซึ่งเรียกbind()ภายใน) ทั้งหมดใช้เฟสเดือดของเหตุการณ์ที่เกิดขึ้น

ในฐานะของ jQuery 1.7 .on()ตอนนี้เป็นวิธีที่ต้องการของเหตุการณ์ที่มีผลผูกพันมากกว่า.bind():

จากhttp://api.jquery.com/bind/ :

ตั้งแต่ jQuery 1.7 เมธอด. on () เป็นวิธีที่ต้องการสำหรับการแนบตัวจัดการเหตุการณ์กับเอกสาร สำหรับเวอร์ชันก่อนหน้านี้. ผูกวิธี () จะใช้สำหรับการแนบการจัดการเหตุการณ์โดยตรงกับองค์ประกอบ ตัวจัดการจะแนบไปกับองค์ประกอบที่เลือกในปัจจุบันในวัตถุ jQuery ดังนั้นองค์ประกอบเหล่านั้นจะต้องมีอยู่ ณ จุดที่เรียกว่า. ผูก () เกิดขึ้น สำหรับการเชื่อมเหตุการณ์ที่ยืดหยุ่นมากขึ้นให้ดูการอภิปรายของการมอบหมายเหตุการณ์ใน. on () หรือ .delegate ()

หน้าเอกสารตั้งอยู่ที่ http://api.jquery.com/on/

สิ่งที่ใกล้เคียงที่สุดคือฟังก์ชัน bind:

http://api.jquery.com/bind/

$('#foo').bind('click', function() {
  alert('User clicked on "foo."');
});

สิ่งหนึ่งที่ควรทราบคือวิธีการเหตุการณ์ jQuery ไม่เริ่มทำงาน / ดักจับloadบนembedแท็กที่มี SVG DOM ซึ่งโหลดเป็นเอกสารแยกต่างหากในembedแท็ก วิธีเดียวที่ฉันพบว่ากับดักloadเหตุการณ์ในสิ่งเหล่านี้คือการใช้ JavaScript ดิบ

สิ่งนี้จะไม่ทำงาน (ฉันได้ลองon/ bind/ loadวิธีการ):

$img.on('load', function () {
    console.log('FOO!');
});

อย่างไรก็ตามการทำงานนี้:

$img[0].addEventListener('load', function () {
    console.log('FOO!');
}, false);

ตอนนี้คุณควรใช้.on()ฟังก์ชันเพื่อเชื่อมโยงเหตุการณ์

นี่คือการรักษาที่ยอดเยี่ยมเกี่ยวกับ Mozilla Development Network (MDN) ของปัญหานี้สำหรับ JavaScript มาตรฐาน (ถ้าคุณไม่ต้องการพึ่งพา jQuery หรือเข้าใจโดยทั่วไปดีกว่า):

https://developer.mozilla.org/en-US/docs/DOM/element.addEventListener

นี่คือการอภิปรายของการไหลของเหตุการณ์จากลิงค์ในการรักษาข้างต้น:

http://www.w3.org/TR/DOM-Level-3-Events/#event-flow

ประเด็นสำคัญบางประการคือ:

• อนุญาตให้เพิ่มมากกว่าตัวจัดการเดียวสำหรับเหตุการณ์
• มันช่วยให้คุณควบคุมเฟสได้อย่างละเอียดยิ่งขึ้นเมื่อผู้ฟังเปิดใช้งาน (การจับภาพกับการเดือดปุด ๆ )
• มันทำงานได้กับองค์ประกอบ DOM ใด ๆ ไม่เพียง แต่องค์ประกอบ HTML
• ค่าของ "this" ที่ส่งไปยังเหตุการณ์ไม่ใช่วัตถุทั่วโลก (หน้าต่าง) แต่องค์ประกอบที่องค์ประกอบถูกยิง มันสะดวกมาก
• รหัสสำหรับเบราว์เซอร์ IE ดั้งเดิมนั้นง่ายและอยู่ภายใต้หัวข้อ "Legacy Internet Explorer และ attachEvent"
• คุณสามารถรวมพารามิเตอร์ถ้าคุณใส่ตัวจัดการในฟังก์ชันที่ไม่ระบุชื่อ