[javascript] Javascript의 MSIE 및 addEventListener 문제?

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

Chrome / Safari에서는 페이지의 콘텐츠를 복사 할 때 위의 “beforecopy”기능이 실행됩니다. MSIE는이 기능도 지원해야하지만 어떤 이유로 다음 오류가 발생합니다.

“개체가이 속성 또는 메서드를 지원하지 않습니다.”

이제 Internet Explorer가 본문 노드와 함께 작동하지 않는다는 것을 이해했지만 ID로 노드를 제공하면 제대로 작동한다고 생각했을 것입니다. 아무도 내가 뭘 잘못하고 있는지에 대한 아이디어가 있습니까? 미리 감사드립니다.

** 세 번째 매개 변수 “False”가 무엇에 좋은지 말해 줄 수있는 사람에게는 보너스 포인트입니다.



답변

IE에서는 attachEvent표준 addEventListener.

일반적인 방법은 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');
});

여기 에서 위 코드의 예를 실행할 수 있습니다 .

의 세 번째 인수 addEventListeneruseCapture; 참이면 사용자가 이벤트 캡처 를 시작하려고 함을 나타냅니다 .


답변

JQuery 2.x를 사용하는 경우 다음을 추가하십시오.

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

이것은 나를 위해 일했습니다.


답변

추가해보십시오

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

여는 헤드 태그 바로 뒤에


답변

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);
}

자체 이벤트 처리 래퍼 작성을 피하고 대신 JavaScript 프레임 워크 (예 : jQuery , Dojo , MooTools , YUI , Prototype 등)를 사용하고이 문제에 대한 수정을 직접 만들지 않는 것이 좋습니다.

그런데 W3C 이벤트 모델의 세 번째 인수는 버블 링 이벤트와 캡처 이벤트 간의 차이 와 관련이 있습니다 . 거의 모든 상황에서 이벤트가 캡처 될 때가 아니라 버블 링 될 때 이벤트를 처리하기를 원할 것입니다. 버블 링되지 않는 텍스트 상자에 “포커스”이벤트와 같은 것에 이벤트 위임 을 사용할 때 유용합니다 .


답변

IE11부터는 addEventListener. attachEvent더 이상 사용되지 않으며 오류가 발생합니다.


답변

PPK가 지적 하듯이 여기에 , IE에서 당신은 또한 사용할 수 있습니다

e.cancelBubble = true;


답변

를 사용 <meta http-equiv="X-UA-Compatible" content="IE=9">하면 IE9 +는 addEventListener다음과 같이 이벤트 이름에서 “on”을 제거하여 지원 합니다.

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