Метод изменения jQuery для типа ввода = «файл»

Question

Я пытаюсь использовать jQuery 100% с помощью простого и элегантного API, но я столкнулся с несогласованностью между API и прямым HTML, что я не могу выяснить.

У меня есть сценарий загрузки файла AJAX (который работает правильно), который я хочу запускать каждый раз при изменении значения входного файла. Вот мой рабочий код:

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

Когда я конвертировать onchange событие в реализации JQuery:

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

результат не то же самое. С атрибутом onchange функция uploadFile() вызывается в любое время, когда значение изменяется, как ожидается. Но с обработчиком события jQuery API .change() событие только срабатывает при первом изменении значения. Любое изменение значения после этого игнорируется. Это кажется мне неправильным, но, конечно, это не может быть недосмотр jQuery, верно?

Неужели кто-то еще столкнулся с одной и той же проблемой и у вас есть обходное решение или решение проблемы, отличное от того, что я описал выше?

Answer 1

является загружающим устройством ajax, обновляющим ваш элемент ввода? , если это так, вы должны рассмотреть возможность использования метода .live().

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

обновление:

из JQuery 1.7+ вы должны теперь использовать .он()

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

Answer 2

Я не мог получить IE8 + работать, добавив обработчик события Jquery к типу входного файла , Я должен был пойти старую школу и добавить атрибут onchange="" к входному тегу:

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

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

Answer 3

По JQuery 1.7, метод .live() является устаревшим. Используйте .on() для присоединения обработчиков событий. Пользователи более старых версий jQuery должны использовать .delegate() в предпочтении .live(). Refer: http://api.jquery.com/on/

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