모두가 js에서 이벤트 모니터링을 많이 사용합니다. 브라우저가 addEventListener 및 attachmentEvent를 지원하는지 확인하는 것입니다. 온라인에서 찾을 수 있는 이벤트 모니터링 방법 중 일부는 완벽하지 않습니다. 아래 방법은 이벤트 바인딩 취소 시 일부 작업을 수행한 것을 제외하고는 이벤트 리스너 추가와 동일하며, 이제 익명 함수 사용을 지원하므로 이벤트 바인딩 시 별도로 함수 이름을 지정할 필요가 없습니다.
메인 코드:
/*이벤트 바인딩 및 바인딩 해제*/
var handlerHash = {};
var 바인딩 = (function() {
if (window.addEventListener) {
return function( el, type, fn, 캡처) {
el.addEventListener(type, function(){
fn();
handlerHash[type] = handlerHash[type] || [];
handlerHash [type].push(arguments.callee);
}, 캡처);
};
} else if (window.attachEvent) {
반환 함수(el, type, fn, 캡처) {
el.attachEvent("on" 유형, function(){
fn();
handlerHash[type] = handlerHash[type] || [];
handlerHash[type].push (arguments.callee);
});
};
}
})();
var unbind = (function(){
if (window.addEventListener) {
return function(el, type) {
if(handleHash[type]){
var i = 0, len = handlerHash[type].length;
for (i; i el.removeEventListener(type, handlerHash[type][i]);
}
};
};
} else if (window.attachEvent) {
return function(el, type) {
if(handleHash[type]){
var i = 0, len = handlerHash[type].length;
for (i; i el.detachEvent("on" 유형, handlerHash[유형][i]);
}
};
};
}
})() ;
원리 분석:
handleHash는 해시 테이블 캐시 이벤트로 작동합니다. handlerHash['이벤트 이름']은 여러 이벤트 수신 방법을 추가하는 배열입니다. 어떤 이벤트를 바인딩 해제할 때, handlerHash['이벤트 이름'] 배열을 순회한 후 제거하세요.
용도:
바인드(obj,'click',function(){
경고('클릭');
});
unbind(obj,'click');