Método de cambio de jQuery en el tipo de entrada = "archivo"

Question

Estoy tratando de adoptar jQuery al 100% con su API simple y elegante, pero he encontrado una inconsistencia entre la API y el HTML directo que no puedo descifrar.

Tengo un script de carga de archivos AJAX (que funciona correctamente) que quiero ejecutar cada vez que cambia el valor de entrada del archivo. Aquí está mi código de trabajo:

<input type="file" size="45" name="imageFile" id="imageFile" onchange="uploadFile()"> 

al convertir el evento onchange a una aplicación de jQuery:

$('#imageFile').change(function(){ uploadFile(); }); 

el resultado no es el mismo. Con el atributo onchange, se llama a la función uploadFile() cada vez que se cambia el valor como se espera. Pero con el controlador de eventos jQuery API .change(), el evento solo se activa la primera vez que se cambia un valor. Cualquier cambio de valor después de eso se ignora. Esto me parece incorrecto, pero seguramente esto no puede ser un descuido de jQuery, ¿verdad?

¿Alguien más ha tenido el mismo problema y tiene una solución o solución al problema distinta a la que he descrito anteriormente?

Answer 1

es la herramienta de carga de ajax que actualiza su elemento de entrada? si es así, debería considerar usar el método .live().

$('#imageFile').live('change', function(){ uploadFile(); }); 

actualización:

de jQuery 1.7+ debería utilizar ahora .en()

$(parent_element_selector_here or document).on('change','#imageFile' , function(){ uploadFile(); }); 

Answer 2

no pude conseguir IE8 + funcione mediante la adición de un controlador de eventos jQuery para el tipo de entrada de archivo . Tenía que ir de la vieja escuela y añadir el atributo onchange="" a la etiqueta de entrada:

<input type='file' onchange='getFilename(this)'/> 

function getFileName(elm) { 
    var fn = $(elm).val(); 
    .... 
} 

Answer 3

A partir de jQuery 1.7, es obsoleto el método .live(). Use .on() para adjuntar manejadores de eventos. Los usuarios de versiones anteriores de jQuery deben usar .delegate() en preferencia a .live(). Consulte: http://api.jquery.com/on/

$('#imageFile').on("change", function(){ uploadFile(); });