addEventListener y attachEvent

[infraweb]

Hola primero que nada soy nuevo y les envio un saludo a todos excelente foro de informatica.

Ok tengo una preguntas sobre addEventListener y attachEvent espero me puedan ayudar

1) Que es mejor utilizar los metodos de addEventListener y attachEvent o el tradicional onclick = function,


2) al utilizar addEventListener y attachEvent tengo que hacer codigo para que funcione en todos los navegadores lo que necesito hay una forma de pasar la instancia de la funcion addEventListener y attachEvent a una variable para seguir utilizandola en el codigo por ejemplo he intentado hacer esto pero nose si javascript lo permite o lo estoy haciendo mal no uso mucho el javascript pero necesito crear un sitio con esta estructura

var mievento;

mievento = new addEventListener(); o mievento = new function addEventListener()

mievento('click',funcion,true);

muchas gracias por la ayuda.

[hectorborges]

Hola, a mi me gusta más trabajar con addEventListener y attachEvent porque siento que dan más libertad que los eventos tipo "onclick" (a pesar de que son una abstracción de lo mismo básicamente), pero lograr que trabajen en todos los navegadores y resolver el problema de pasar la instancia que levantó el evento es un poco tedioso porque hay que hacer muchas verificaciones... te recomiendo echarle un ojo a framework de javascript Prototype (http://prototypejs.org/) que tiene funciones para el manejo de eventos que lo facilitan todo... asi te evitas los dolores de cabeza.

Saludos,

Héctor

[infraweb]

Muchas gracias por responder hectorborges lamentablemente en eso estoy veo que es tedioso pasar la instancia por eso no me gustaria utilizar el addEventListener y attachEvent pero el onclick no tiene las ventajas de usar multiples eventos como el addEventListener y el attachEvent y lastimosamente no me dejan utilizar frameworks externos como el Prototype asi que creo que voy a tener que quebrarme la cabeza con los navegadores para poder usar el addEventListener y el attachEvent muchas gracias por la ayuda.

[hectorborges]

Bueno esperemos entonces que esto te sirva... estuve buscando de cuando yo lo implementé pero no encontré el código y ya lo olvidé, pero creo que era algo como éste otro que encontré:

Código:

//*** This code is copyright 2003 by Gavin Kistner, [email protected]
//*** It is covered under the license viewable at http://phrogz.net/JS/_ReuseLicense.txt
//*** Reuse or modification is free provided you abide by the terms of that license.
//*** (Including the first two lines above in your source code satisfies the conditions.)


//***Cross browser attach event function. For 'evt' pass a string value with the leading "on" omitted
//***e.g. AttachEvent(window,'load',MyFunctionNameWithoutParenthesis,false);

function AttachEvent(obj,evt,fnc,useCapture){
	if (!useCapture) useCapture=false;
	if (obj.addEventListener){
		obj.addEventListener(evt,fnc,useCapture);
		return true;
	} else if (obj.attachEvent) return obj.attachEvent("on"+evt,fnc);
	else{
		MyAttachEvent(obj,evt,fnc);
		obj['on'+evt]=function(){ MyFireEvent(obj,evt) };
	}
} 

//The following are for browsers like NS4 or IE5Mac which don't support either
//attachEvent or addEventListener
function MyAttachEvent(obj,evt,fnc){
	if (!obj.myEvents) obj.myEvents={};
	if (!obj.myEvents[evt]) obj.myEvents[evt]=[];
	var evts = obj.myEvents[evt];
	evts[evts.length]=fnc;
}
function MyFireEvent(obj,evt){
	if (!obj || !obj.myEvents || !obj.myEvents[evt]) return;
	var evts = obj.myEvents[evt];
	for (var i=0,len=evts.length;i<len;i++) evts[i]();
}

El segundo problema que es obtener el elemento DOM que levantó el evento se resuelve con estas verificaciones:

Código:

function atenderEvento(e) {
	var targ;
	if (!e) var e = window.event;
	if (e.target) targ = e.target;
	else if (e.srcElement) targ = e.srcElement;
	if (targ.nodeType == 3) // defeat Safari bug
		targ = targ.parentNode;
}

Espero te sea útil.

Saludos,

Héctor

[infraweb]

Muchas gracias Hector, esto me sirve lo voy a implementar gracias por la ayuda.