Dudas con addEventListener

[p3rikl3s]

Mis amigos, tengo un formulario en el genero de forma dinámica inputs de tipo "file". A estos inputs quisiera asociarlos con un addEventListener a medida que son generados, sin embargo no logro hacerlo. Intente con esto:

Código:

document.querySelector('input[type="file"]').addEventListener('change', handleFileSelect, true);

Pero no funcionó. ¿Es posible hacer algo así?

Agradezco enormemente de antemano su ayuda.

Saludos

[zerokilled]

buenas...
verifica que querySelector realmente esté devolviendo un elemento. por lo demás, entiendo que el evento change debería funcionar en un INPUT TYPE FILE.

[p3rikl3s]

Gracias zerokilled!

Pero disculpa mi desconocimiento, ¿Cómo puedo verificar esto?

Saludos y muchísimas gracias

[zerokilled]

en la consola del navegador ejecutas document.querySelector('input[type="file"]'). si el resultado es null, entonces querySelector no ha encontrado ningún elemento. por otro lado, ¿estás seguro que tu navegador tiene soporte para querySelector?

[p3rikl3s]

Zerokilled, gracias por responder. Sí, mi navegador soporta querySelector, pruebo varios ejemplos de este tipo y todos andan muy bien.

Al ejecutar:

Código Javascript:

document.querySelector('input[type="file"]')
 

me devuelve siempre el primer input type="file" a pesar de que ya se han generado los otros inputs.

Mi formulario funciona así:

1. Tengo un primer input

Código HTML:

<input type='file' id='userfile' name='userfile[]' multiple/>
 

2. Luego de seleccionar un archivo usando el primer input, se genera otro input así

Código HTML:

<input type='file' id='userfile_F1' name='userfile[]' multiple/>
 

Y así hasta cinco. Lo que busco es agregar el addEventListener a todos estos inputs, pero con esto no funciona:

Código Javascript:

document.querySelector('input[type="file"]').addEventListener('change', handleFileSelect, true);
 

¿Acaso es posible lograr esto? Agradezco tu respuesta. Gracias!

[opzina]

Debes adjuntar el evento luego de creado el "input type file" en el DOM.

En tu función dónde creas ese input dinámico, puede adjuntar el evento.

[hackjose]

necesitas hacer una funcion

function crear()
{
//usar createelement o innerhtml para el input
//una vez incrustado le asocias el addeventlistener
}

acuerdate que el elemento debe ya existir para que le asocies un addeventlistener

salu2

[Carlangueitor]

document.querySelector solo devuelve el primer objeto, para obtener todos usa document.querySelectorAll.


Saludos