Как дублировать ввод файла после выбора файла (.change ())

Question

Как дублировать ввод файла после выбора файла (.change ())

0

Попытка создать поле ввода для загрузки файлов. Я хочу, когда пользователь выбирает файл, поле ввода файла дублируется с новым пустым

то, что я использовал, было что-то вроде этого

<form>
<input type='file' class='addImage' />
</form>


$(function(){ 
        $('.addImage').change(function(){
            $("<input type='file' class='addImage' />").appendTo('form');
        });
    });

Смотрите это в прямом эфире http://jsfiddle.net/R5QSy/1/

Он работает и отображает только один дубликат одного файла. Если я выберу файл из нового сгенерированного ввода, больше не произойдет дублирования! как я могу сделать процесс дублирования неограниченным? благодаря

Newbie 08 нояб. 2013, в 23:39

Источник

0

используйте делегирование событий для элементов, которые не существуют, когда выполняется код. Когда вы заменяете элемент, его привязка к событию теряется
charlietfl 08 нояб. 2013, в 22:21

Теги:

jquery

html

forms

1 ответ

Ещё вопросы

используйте делегирование событий для элементов, которые не существуют, когда выполняется код. Когда вы заменяете элемент, его привязка к событию теряется

Jon · Accepted Answer · 2013-11-08T19-26-00.000Z

Второй входной файл, который добавляется, еще не существует в то время, когда ваша функция прикрепляет обработчик change, поэтому он не отвечает на событие change. Вы можете исправить это, используя вместо этого делегированный обработчик событий:

$(document).on("change", ".addImage", function(){ ... });

Обратите внимание, что это, вероятно, не будет удовлетворительным, так как каждый раз, когда вы меняете выбранный файл на любом из элементов, будет добавлен новый вход файла (даже если в форме уже есть неиспользуемые элементы управления в форме). Вы можете предотвратить это, добавив класс к любому элементу, когда обработчик вызывается на нем и проверяет, что он еще не имеет класс перед добавлением нового элемента.

В качестве альтернативы решению класса вы можете изменить селектор на .addImage:last .