• AddEventListener มี 3 พารามิเตอร์ดังที่แสดงด้านล่าง:
Element.addeventListener (ประเภท, ผู้ฟัง, usecapture);
| พารามิเตอร์ | คำอธิบายพารามิเตอร์ |
|---|---|
| องค์ประกอบ | วัตถุที่จะผูกเหตุการณ์และโหนด HTML |
| พิมพ์ | สำหรับชื่อเหตุการณ์โปรดลบ "เปิด" ก่อนเหตุการณ์ ตัวอย่างเช่น "onclick" ควรเขียนเป็น "คลิก" และ "onmouseover" ควรเขียนเป็น "Mouseover" |
| ผู้ฟัง | ในการผูกฟังก์ชั่นการฟังเหตุการณ์โปรดใช้ความระมัดระวังในการเขียนเฉพาะชื่อฟังก์ชั่นและไม่รวมวงเล็บ |
| usercapture | วิธีการตรวจสอบเหตุการณ์สามารถเป็นจริงและเท็จเท่านั้น: จริงการใช้โหมดการจับภาพ; เท็จใช้โหมดฟอง หากไม่มีข้อกำหนดพิเศษก็มักจะเป็นเท็จ |
ที่นี่จำเป็นต้องพูดคุยเกี่ยวกับความแตกต่างระหว่างโหมดการจับภาพและโหมดฟอง
ดังที่แสดงในรูปมีองค์ประกอบ Div สองชั้นและทั้งสองเหตุการณ์คลิก โดยทั่วไปถ้าฉันคลิกที่องค์ประกอบสีน้ำเงินด้านในจะไม่เพียง แต่กระตุ้นเหตุการณ์การคลิกขององค์ประกอบสีน้ำเงิน แต่ยังกระตุ้นเหตุการณ์การคลิกขององค์ประกอบสีแดงในเวลาเดียวกัน พารามิเตอร์ USEcapture คือการควบคุมลำดับของเหตุการณ์สองคลิกในเวลานี้ หากเป็นเท็จโหมดฟองจะถูกใช้ มันเป็นกระบวนการจากภายในสู่ภายนอกดังนั้นเหตุการณ์การคลิกขององค์ประกอบสีน้ำเงินจะถูกดำเนินการก่อนจากนั้นเหตุการณ์คลิกขององค์ประกอบสีแดง ถ้าเป็นจริงมันเป็นโหมดการจับภาพ ตรงกันข้ามกับโหมดฟองมันมาจากด้านนอกถึงด้านใน เหตุการณ์การคลิกขององค์ประกอบสีแดงจะถูกดำเนินการก่อนก่อนเหตุการณ์คลิกขององค์ประกอบสีน้ำเงินจะถูกดำเนินการ
หาก usecapture ที่ใช้โดยองค์ประกอบของเลเยอร์ที่แตกต่างกันองค์ประกอบเป้าหมายจะมองหาเหตุการณ์ที่ตั้งค่าเป็นโหมดจับภาพจากองค์ประกอบด้านนอกสุด หลังจากไปถึงองค์ประกอบเป้าหมายเพื่อดำเนินการเหตุการณ์ขององค์ประกอบเป้าหมายจากนั้นมองหาเหตุการณ์ที่ตั้งค่าเป็นโหมดฟอง
• AttachEvent มีพารามิเตอร์ 2 ตัวดังที่แสดงด้านล่าง:
element.attachevent (ประเภท, ผู้ฟัง);
| พารามิเตอร์ | คำอธิบายพารามิเตอร์ |
|---|---|
| องค์ประกอบ | วัตถุที่จะผูกเหตุการณ์และโหนด HTML |
| พิมพ์ | สำหรับชื่อเหตุการณ์โปรดเพิ่ม "on" ก่อนเหตุการณ์เช่น "onclick" และ "onmouseover" ซึ่งเป็นความแตกต่างจาก addeventListener |
| ผู้ฟัง | ในการผูกฟังก์ชั่นการฟังเหตุการณ์โปรดใช้ความระมัดระวังในการเขียนเฉพาะชื่อฟังก์ชั่นและไม่รวมวงเล็บ |
AddEventListener () เป็นวิธีมาตรฐานในการผูกฟังก์ชันการฟังเหตุการณ์ซึ่งได้รับการสนับสนุนโดย W3C Chrome, Firefox, Opera, Safari, IE9.0 และเหนือสิ่งอื่นใดสนับสนุนฟังก์ชั่นนี้ อย่างไรก็ตาม IE8.0 และด้านล่างไม่สนับสนุนวิธีนี้มันใช้ attaineVent () เพื่อผูกฟังก์ชันการฟังเหตุการณ์ ดังนั้นวิธีการเหตุการณ์ที่มีผลผูกพันนี้จะต้องจัดการกับปัญหาความเข้ากันได้ของเบราว์เซอร์
รหัสที่เข้ากันได้กับ IE และ Non-IE Event Event Binding:
ฟังก์ชั่น addevent (obj, type, handle) {ลอง {// chrome, firefox, opera, safari, ie9.0 และเหนือกว่ารุ่น obj.addeventlistener (ประเภท, ด้ามจับ, เท็จ); } catch (e) {ลอง {// ie8.0 และต่ำกว่าเวอร์ชัน obj.attachevent ('on' + type, handle); } catch (e) {// เบราว์เซอร์ต้น obj ['on' + type] = handle; -หรือ
ฟังก์ชั่น RegeVent (ele, event_name, fun) {if (window.attachevent) ele.attachevent (event_name, fun); // คือเบราว์เซอร์อื่น {event_name = event_name.replace (/^on/, ""); // ถ้าเริ่มต้นให้ลบเช่น onclick-> คลิก ele.addeventListener (event_name, fun, false); // ไม่ใช่เบราว์เซอร์}}}บทความข้างต้นพูดสั้น ๆ เกี่ยวกับความแตกต่างระหว่าง AddEventListener และ AttachEvent เป็นเนื้อหาทั้งหมดที่ฉันแบ่งปันกับคุณ ฉันหวังว่าคุณจะให้ข้อมูลอ้างอิงและฉันหวังว่าคุณจะสนับสนุน wulin.com มากขึ้น