javascript - keys - addEventListener en Internet Explorer

press key javascript

Question

¿Cuál es el equivalente al Element Object en Internet Explorer 9?

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

¿Cómo funciona en Internet Explorer?

Si hay una función igual a addEventListener y no sé, explica por favor.

Cualquier ayuda sería apreciada. Siéntase libre de sugerir una forma completamente diferente de resolver el problema.

Answer 1

Aquí hay algo para aquellos a los que les gusta el código bonito.

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

Desvergonzadamente robado de Iframe-Resizer .

Answer 2

Como dijo Delan, desea utilizar una combinación de addEventListener para las versiones más nuevas y attachEvent para las más antiguas.

Encontrarás más información sobre los oyentes de eventos en MDN . (Tenga en cuenta que hay algunas advertencias con el valor de ''esto'' en su oyente).

También puede usar un marco como jQuery para abstraer el manejo del evento por completo.

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

Answer 3

EDITAR

Escribí un fragmento que emula la interfaz EventListener y el ie8, se puede llamar incluso en objetos simples: https://github.com/antcolag/iEventListener/blob/master/iEventListener.js

ANTIGUA RESPUESTA

esta es una forma de emular addEventListener o attachEvent en navegadores que no admiten uno de esos
la esperanza ayudará

(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)

Answer 4

Estoy usando esta solución y funciona en IE8 o superior.

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

Y entonces:

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

Esto funcionará tanto con IE8 como con Chrome, Firefox, etc.

Answer 5

John Resig, autor de jQuery, presentó su versión de la implementación en addEvent navegadores de addEvent y removeEvent para eludir los problemas de compatibilidad con addEventListener incorrecto o inexistente de IE.

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

Fuente: http://ejohn.org/projects/flexible-javascript-events/

Answer 6

Yo usaría estos polyfill https://github.com/WebReflection/ie8

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

Answer 7

addEventListener es compatible desde la versión 9 en adelante; para versiones anteriores, use la función attachEvent algo similar.

Answer 8

addEventListener es el método DOM apropiado para utilizar para adjuntar controladores de eventos.

Internet Explorer (hasta la versión 8) usó un método alternativo attachEvent .

Internet Explorer 9 es compatible con el método addEventListener adecuado.

Lo siguiente debe ser un intento de escribir una función addEvent cross-browser.

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