[SOLUCIONADO] Problema con addEventListener

[NeaFan]

Hola a todos, ire al grano tengo en un documento .js el siguiente código:

Código Javascript:

window.onload = function () {
    document.getElementById('txtNombre').addEventListener('keyup', function () {
        /* Serie de funciones con parámetros */
    }, false);
}
 

Y en mi pagina principal el siguiente contenido:

Código HTML:

<!--Contenido-->
<input type="text" id="txtNombre" name="txtNombre"/>
<!--Mas Contenido-->
 

Lo curioso es que solo funciona en CHROME, intento crear cosas tan sencillas como:

Código Javascript:

window.onload = function () {
    document.getElementById('txtNombre').addEventListener('keyup', function () {
        alert('hola');
    }, false);
}
 

El resultado es lo mismo, solo funciona en Chrome, ni Firefox ni Opera reaccionan al addEventListener...

Alguna idea de que este pasando.

[Alexis88]

Lo probé en Chrome, Firefox, Opera e Internet Explorer y en todos funciona. Quizá te haga falta limpiar la caché de esos navegadores. Pulsa Ctrl + F5 y prueba.

Saludos

[GeekGirl]

A mi también me funciona en todos los navegadores. Para limpiar la caché es CTRL + SHIFT + F5

Saludos

[NeaFan]

Pues la situación es súper-extraña, yo tengo configurado mi navegador Firefox para que borre todo contenido en memoria local una vez cierro el mismo, puesto que realizo muchas pruebas cada vez que termino de implementar algún código; Estuve observando el código fuente desde el navegador y la referencia del javascript muestra esto:

Código Javascript:

(function () {
 
})();
 
window.onload = function () {
    document.getElementById('txtNombre').addEventListener('keyup', function () {
        alert('hola');
//        Cargar_Persona('txtNombre');
    }, false);
//    document.getElementById('txtCaja').addEventListener('change', function () {
//        Cargar_Caja('txtCaja', 'marco-consulta');
//    }, false);
//    document.getElementById('txtDebito').addEventListener('change', function () {
//        Cargar_Subtotal('txtDebito', 'txtSobrecupo', 'txtDescuento', 'txtHabito');
//    }, false);
//    document.getElementById('txtSobrecupo').addEventListener('change', function () {
//        Cargar_Precio('txtHabitacion', 'txtDebito');
//    }, false);
//    document.getElementById('txtDescuento').addEventListener('change', function () {
//        Cargar_Precio('txtHabitacion', 'txtDebito');
//    }, false);
//    document.getElementById('txtRato').addEventListener('change', function () {
//        Cargar_Precio('txtHabitacion', 'txtDebito');
//    }, false);
//    
//    document.getElementById('txtHabitacion').addEventListener('change', function () {
//        Cargar_Precio('txtHabitacion', 'txtDebito');
//    }, false);
//    document.getElementById('imgSobrecupo').addEventListener('click', function () {
//        Cambiar_Sobrecupo(this, 'txtSobrecupo');
//    }, false);
//    document.getElementById('imgDescuento').addEventListener('click', function () {
//        Cambiar_Descuento(this, 'txtDescuento');
//    }, false);
//    document.getElementById('imgRato').addEventListener('click', function () {
//        Cambiar_Rato(this, 'txtRato');
//    }, false);
    
};
 

Claro esta en busca de soluciones he desactivado una gran cantidad de codigo generado a partir de PHP. lo importante es que el documento .js contiene estas simples lineas.

«Comente provisionalmente algunas lineas, y en la primeras lineas tengo una función anónima que se auto ejecuta, provisionalmente también esta sin código pero en el existe una serie de sentencias que no es de interés para la problemática que presento.»

NO TENGO NADA EN TEMPORALES :S ¿que podrá ser?

PD: No tiene nada que ver pero por si algo uso Ubuntu 14.04 y Firefox 35.0 [... canonical 1.0]

[Alexis88]

Por lo que veo, intentas ejecutar el código una vez que el la página haya cargado y seguramente tienes al script en la cabecera del documento. Para que no te líes más, simplemente coloca todo el código JavaScript después de todos los elementos del documento y justo antes de la etiqueta </body>. El funcionamiento será el esperado.

Por cierto, GeekGirl, con Ctrl + F5 es suficiente para refrescar la caché de la página y así poder ver la versión más reciente de la misma.

Saludos

[NeaFan]

Iniciado por Alexis88

Por lo que veo, intentas ejecutar el código una vez que el la página haya cargado y seguramente tienes al script en la cabecera del documento. Para que no te líes más, simplemente coloca todo el código JavaScript después de todos los elementos del documento y justo antes de la etiqueta </body>. El funcionamiento será el esperado.
Saludos

Estabas en lo correcto es el comportamiento esperado, en realidad aunque esto me permite adelantar en mi trabajo no deja de ser un tanto triste que recurra a este tipo de trucos. me gustaría seguir la estructura, [Eventos, Funciones y Estilos] en el HEAD. Seguiré trabajando basándome en tu propuesta hasta que encuentre otra mas elegante ^_^.

Muchísimas gracias. Es curioso que no se me hubiese ocurrido una solución tan simple «Supongo que daba por hecho de que se habían cargado los eventos».

[Alexis88]

En realidad no se trata de ningún 'truco'. Incluso en el centro de aprendizaje de jQuery, enseñan a trabajar de la misma manera.

Saludos