이 기사의 예에서는 브라우저 간 이벤트 바인딩 기능 추가 및 삭제의 JavaScript 구현을 설명합니다. 참고할 수 있도록 모든 사람과 공유하세요. 세부 내용은 다음과 같습니다.
IE의 이벤트 바인딩 기능은 attachmentEvent이고, Firefox와 Safari는 addEventListener입니다. Opera는 둘 다 지원합니다. jQuery를 사용하면 간단한 바인딩()을 사용하거나 $().click()과 같은 함수를 사용하여 문제를 해결할 수 있습니다. JavaScript 프레임워크를 사용하지 않는 경우 다음과 같은 캡슐화된 바인딩() 함수를 사용할 수 있습니다.
이벤트 바인딩 바인딩 추가()
/************************************ * 添加事件绑定 * @param obj : 要绑定事件的元素 * @param type : 事件名称。不加 "on". 如 : "click" 而不是 "onclick". * @param fn : 事件处理函数 ************************************/ function bind( obj, type, fn ){ if( obj.attachEvent){ obj['e'+type+fn]= fn; obj[type+fn]=function(){ obj['e'+type+fn]( window.event); } obj.attachEvent('on'+type, obj[type+fn]); }else obj.addEventListener( type, fn,false); }
예를 들어 문서에 클릭 이벤트를 추가합니다.
var fn=function(){ alert("Hello, World!!"); }; bind(document,"click", fn);
이벤트 바인딩 삭제 unbind()
위의 바인딩() 함수에 대한 unbind()
/************************************ * 删除事件绑定 * @param obj : 要删除事件的元素 * @param type : 事件名称。不加 "on". 如 : "click" 而不是 "onclick" * @param fn : 事件处理函数 ************************************/ function unbind( obj, type, fn ){ if( obj.detachEvent){ obj.detachEvent('on'+type, obj[type+fn]); obj[type+fn]=null; }else obj.removeEventListener( type, fn,false); }
예를 들어 첫 번째 바인딩된 문서 클릭 이벤트를 삭제합니다.
이 기사가 모든 사람의 JavaScript 프로그래밍 설계에 도움이 되기를 바랍니다.