Programing

Javascript의 MSIE 및 addEventListener 문제?

crosscheck 2020. 9. 18. 07:37
반응형

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; true이면 사용자가 이벤트 캡처 를 시작하려고 함을 나타냅니다 .


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

Though I recommend avoiding writing your own event handling wrapper and instead use a JavaScript framework (such as jQuery, Dojo, MooTools, YUI, Prototype, etc) and avoid having to create the fix for this on your own.

By the way, the third argument in the W3C model of events has to do with the difference between bubbling and capturing events. In almost every situation you'll want to handle events as they bubble, not when they're captured. It is useful when using event delegation on things like "focus" events for text boxes, which don't bubble.


As of IE11, you need to use addEventListener. attachEvent is deprecated and throws an error.


As PPK points out here, in IE you can also use

e.cancelBubble = true;

Using <meta http-equiv="X-UA-Compatible" content="IE=9">, IE9+ does support addEventListener by removing the "on" in the event name, like this:

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

The problem is that IE does not have the standard addEventListener method. IE uses its own attachEvent which does pretty much the same.

Good explanation of the differences, and also about the 3rd parameter can be found at quirksmode.

참고URL : https://stackoverflow.com/questions/1695376/msie-and-addeventlistener-problem-in-javascript

반응형