MSIE และ addEventListener Problem ใน Javascript?

Question 1

document.getElementById('container').addEventListener('copy',beforecopy,false );

ใน Chrome / Safari ข้างต้นจะเรียกใช้ฟังก์ชัน "beforecopy" เมื่อมีการคัดลอกเนื้อหาในหน้า MSIE ควรจะรองรับฟังก์ชันนี้เช่นกัน แต่ด้วยเหตุผลบางประการฉันได้รับข้อผิดพลาดนี้:

"วัตถุไม่รองรับคุณสมบัติหรือวิธีการนี้"

ตอนนี้ฉันเข้าใจว่า Internet Explorer จะไม่เล่นกับ body node แต่ฉันคิดว่าการให้ node by ID จะทำงานได้ดี ใครมีความคิดเกี่ยวกับสิ่งที่ฉันทำผิด? ขอบคุณล่วงหน้า.

** คะแนนโบนัสสำหรับทุกคนที่สามารถบอกได้ว่าพารามิเตอร์ที่ 3 "False" มีประโยชน์อย่างไร

Question 2

ใน IE ที่คุณต้องใช้มากกว่ามาตรฐานattachEventaddEventListener

แนวทางปฏิบัติทั่วไปคือตรวจสอบว่ามีaddEventListenerวิธีการนี้หรือไม่และใช้หรือไม่ให้ใช้attachEvent:

if (el.addEventListener){
  el.addEventListener('click', modifyText, false); 
} else if (el.attachEvent){
  el.attachEvent('onclick', modifyText);
}

คุณสามารถสร้างฟังก์ชันให้ทำได้:

function bindEvent(el, eventName, eventHandler) {
  if (el.addEventListener){
    el.addEventListener(eventName, eventHandler, false); 
  } else if (el.attachEvent){
    el.attachEvent('on'+eventName, eventHandler);
  }
}
// ...
bindEvent(document.getElementById('myElement'), 'click', function () {
  alert('element clicked');
});

คุณสามารถเรียกใช้ตัวอย่างของรหัสข้างต้นที่นี่

อาร์กิวเมนต์ที่สามaddEventListenerคือuseCapture; ถ้าเป็นจริงก็แสดงว่าผู้ใช้ต้องการที่จะเริ่มต้นการจับภาพเหตุการณ์

Question 3

ในกรณีที่คุณใช้ JQuery 2.x โปรดเพิ่มสิ่งต่อไปนี้ในไฟล์

<html>
   <head>
      <meta http-equiv="X-UA-Compatible" content="IE=edge;" />
   </head>
   <body>
    ...
   </body>
</html>

สิ่งนี้ได้ผลสำหรับฉัน

Question 4

ลองเพิ่ม

<meta http-equiv="X-UA-Compatible" content="IE=edge">

หลังแท็กเปิดหัว

Question 5

Internet Explorer (IE8 และลด) addEventListener(...)ไม่ได้รับการสนับสนุน มีรูปแบบเหตุการณ์ของตัวเองโดยใช้attachEventวิธีการ คุณสามารถใช้รหัสบางอย่างเช่นนี้:

var element = document.getElementById('container');
if (document.addEventListener){
    element .addEventListener('copy', beforeCopy, false); 
} else if (el.attachEvent){
    element .attachEvent('oncopy', beforeCopy);
}

แม้ว่าฉันจะแนะนำให้หลีกเลี่ยงการเขียน wrapper การจัดการเหตุการณ์ของคุณเองและใช้เฟรมเวิร์ก JavaScript แทน (เช่นjQuery , Dojo , MooTools , YUI , Prototypeฯลฯ ) และหลีกเลี่ยงการสร้างการแก้ไขสำหรับสิ่งนี้ด้วยตัวคุณเอง

โดยวิธีการที่อาร์กิวเมนต์ที่สามในรูปแบบ W3C ของเหตุการณ์ที่มีจะทำอย่างไรกับความแตกต่างระหว่างเดือดปุด ๆ และจับเหตุการณ์ ในเกือบทุกสถานการณ์คุณจะต้องการจัดการกับเหตุการณ์ที่เกิดขึ้นไม่ใช่เมื่อถูกจับ จะมีประโยชน์เมื่อใช้การมอบหมายเหตุการณ์กับสิ่งต่างๆเช่นเหตุการณ์ "โฟกัส" สำหรับกล่องข้อความซึ่งจะไม่เกิดฟอง

Question 6

ในฐานะของ IE11, addEventListenerคุณจำเป็นต้องใช้ attachEventเลิกใช้งานแล้วและเกิดข้อผิดพลาด

Question 7

ตามที่ PPK ชี้ให้เห็นที่นี่ใน IE คุณสามารถใช้

e.cancelBubble = true;

Question 8

การใช้<meta http-equiv="X-UA-Compatible" content="IE=9">IE9 + รองรับaddEventListenerโดยการลบ "on" ในชื่อเหตุการณ์เช่นนี้:

 var btn1 = document.getElementById('btn1');
 btn1.addEventListener('mousedown', function() {
   console.log('mousedown');
 });

Question 9

ปัญหาคือ IE ไม่มีaddEventListenerวิธีการมาตรฐาน IE ใช้ของตัวเองattachEventซึ่งก็ทำได้เหมือนกัน

คำอธิบายที่ดีของความแตกต่างและยังเกี่ยวกับพารามิเตอร์ที่ 3 ที่สามารถพบได้ที่ quirksmode