Internet Explorer中的addEventListener

什么是Internet Explorer 9中的元素对象?

if (!Element.prototype.addEventListener) { Element.prototype.addEventListener = function() { .. } } 

它在Internet Explorer中如何工作?

如果有一个函数等于addEventListener ,我不知道,请解释。

任何帮助,将不胜感激。 随意提出一个完全不同的方式来解决这个问题。

addEventListener是用于附加事件处理程序的正确的DOM方法。

Internet Explorer(最高版本8)使用另一个attachEvent方法。

Internet Explorer 9支持正确的addEventListener方法。

以下应该是尝试编写一个跨浏览器的addEvent函数。

 function addEvent(evnt, elem, func) { if (elem.addEventListener) // W3C DOM elem.addEventListener(evnt,func,false); else if (elem.attachEvent) { // IE DOM elem.attachEvent("on"+evnt, func); } else { // No much to do elem[evnt] = func; } } 

jQuery作者John Resig提交了他的addEventremoveEvent的跨浏览器实现版本来规避IE不正确或不存在的addEventListener兼容性问题。

 function addEvent( 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 ); } function removeEvent( obj, type, fn ) { if ( obj.detachEvent ) { obj.detachEvent( 'on'+type, obj[type+fn] ); obj[type+fn] = null; } else obj.removeEventListener( type, fn, false ); } 

来源: http : //ejohn.org/projects/flexible-javascript-events/

我正在使用这个解决scheme,并在IE8或更高版本中工作。

 if (typeof Element.prototype.addEventListener === 'undefined') { Element.prototype.addEventListener = function (e, callback) { e = 'on' + e; return this.attachEvent(e, callback); }; } 

接着:

 <button class="click-me">Say Hello</button> <script> document.querySelectorAll('.click-me')[0].addEventListener('click', function () { console.log('Hello'); }); </script> 

这将同时适用于IE8和Chrome,Firefox等。

正如Delan所说,你想为新版本使用addEventListener,在旧版本中使用attachEvent。

您可以在MDN上find有关事件侦听器的更多信息。 (注意,在你的监听器中有一些与“this”有关的警告)。

你也可以使用像jQuery这样的框架来抽象事件处理。

 $("#someelementid").bind("click", function (event) { // etc... $(this) is whetver caused the event }); 

从版本9开始支持addEventListener ; 对于旧版本,使用有点类似的attachEvent函数。

这是在不支持其中之一的浏览器上模拟addEventListener或attachEvent的一种方法
希望会有所帮助

 (function (w,d) { // var nc = "", nu = "", nr = "", t, a = "addEventListener", n = a in w, c = (nc = "Event")+(n?(nc+= "", "Listener") : (nc+="Listener","") ), u = n?(nu = "attach", "add"):(nu = "add","attach"), r = n?(nr = "detach","remove"):(nr = "remove","detach") /* * the evtf function, when invoked, return "attach" or "detach" "Event" functions if we are on a new browser, otherwise add "add" or "remove" "EventListener" */ function evtf(whoe){return function(evnt,func,capt){return this[whoe]((n?((t = evnt.split("on"))[1] || t[0]) : ("on"+evnt)),func, (!n && capt? (whoe.indexOf("detach") < 0 ? this.setCapture() : this.removeCapture() ) : capt ))}} w[nu + nc] = Element.prototype[nu + nc] = document[nu + nc] = evtf(u+c) // (add | attach)Event[Listener] w[nr + nc] = Element.prototype[nr + nc] = document[nr + nc] = evtf(r+c) // (remove | detach)Event[Listener] })(window, document) 

对于那些喜欢美丽的代码,这是一些东西。

 function addEventListener(obj,evt,func){ if ('addEventListener' in window){ obj.addEventListener(evt,func, false); } else if ('attachEvent' in window){//IE obj.attachEvent('on'+evt,func); } } 

无耻地从Iframe-Resizer中窃取。

我会使用这些polyfill https://github.com/WebReflection/ie8

 <!--[if IE 8]><script src="ajax/libs/ie8/0.2.6/ie8.js" ></script><![endif]-->