BackEnd/Node.js
ie에서 event 사용시
철철22
2018. 6. 21. 10:51
반응형
- IE에서는 event listeners를 붙이거나 없앨 때, addEventListener/removeEventListener 대신에, attachEvent/detachEvent를 쓴다.
- IE에서는 event 이름의 형식이, event가 아닌, onevent 형식을 쓴다.
- IE에서는 event object를 해당 listener의 한 전달 변수(argument)로 돌려주지 않아서, 대신 global event 변수를 써서 접근해야 한다.
- event 발생시 기본적으로 주어진 action이 실행되는 것을 막으려면 preventDefaultmethod를 쓰는 것이 정석이지만, IE에서는 event object의 returnValue 속성 값을 false로 지정해 주어야 한다.
- IE는 event 전달 과정(propagation) 중에서 보통 맨 처럼 진행되는 capture phase를 지원하지 않는다.
- 다른 객체들로의 event 전달 과정을 멈추려면, stopPropagation method를 쓰는 대신에, event object의 cancelBubble 속성 값을 true로 지정해 줘야 한다.
- IE에서는 event listeners를 method가 아닌 독립된 function으로 불러와서, event를 일으킨 target element를 알아볼 때 간단한 this 키워드를 쓸 수가 없고, 대신에 여러 단계의 상당히 복잡한 과정을 거처야만 얻을 수 있다.
if (typeof element.addEventListener != "undefined") {
element.addEventListener("event", eventListener, false);
} else if (typeof element.attachEvent != "undefined") {
var thisListener = function() {
var event = window.event;
if (Function.prototype.call) {
eventListener.call(element, event);
} else {
target._currentListener = eventListener;
target._currentListener(event);
target._currentListener = null;
}
};
element.attachEvent("onevent", thisListener);
}
IE에서는 어느 한 element의 event listener가 DOM에 속해있는 또 다른 node의 reference를 포함하고 있을 경우,
사용자가 다른 페이지로 이동하더라도 해당 listener와 함께 관련된 DOM node들이 메모리에서 지워지지 않고 상주하게 된다.
반응형