it-swarm.com.ru

альтернатива событию onchange в <input type = 'file' />

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

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

Правка

(Аналогично Очистка <input type = 'file' /> используя jQuery , не уверен, что я должен разрешить это как дубликат)

14
Yasir Laghari

Вы можете просто удалить ввод и создать идентичный с javascript - новый будет пустым.

(отредактированный ответ, чтобы быть прямым к сути, комментарии не имеют значения сейчас)

8
raveren

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

2
tfwright

Вы не можете запустить событие change во второй раз при вводе файла, но вы можете запустить событие change на промежутке. Ниже работает в chrome и ​​ff. Я не проверял в IE. $('#change_span').bind('change',function(){ alert($('#file_1').val()) })

<span id='change_span'><input id="file_1" type="file"></span>

1
Andrey

Там действительно нет никакого способа исправить это. Если вы добавите какой-либо другой прослушиватель или таймер, то вы потенциально можете загрузить файл, даже если пользователь этого не хочет (например, с помощью щелчка мышью). Вы уверены, что загрузка того же файла не может быть выполнена другим способом? Как насчет очистки ввода после начала загрузки (или замены его новым вводом, если вы не можете очистить его).

1
Marius

Установите значение входа "" в обратном вызове onchange. Таким образом, если тот же файл будет выбран в следующий раз, событие onchange будет по-прежнему вызываться, потому что значение отличается от "".

document.getElementById('files').value = "";
1
WebWanderer

Такое поведение присутствует только в IE? Если это так, это может быть связано с этой проблемой:
событие изменения jQuery при <select> не запускается в IE
По сути: вам может понадобиться проверить onClick вместо этого.

0
Daniel Sloof
function resetFileInput ($element) {
  var clone = $element.clone(false, false);
  $element.replaceWith(clone);
}

А затем используйте live:

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

Хорошо сработало для меня!

0
oreoshake

Если вы не хотите использовать jQuery

<form enctype='multipart/form-data'>
    <input onchange="alert(this.value); return false;" type='file'>
    <br>
    <input type='submit' value='Upload'>
</form>

Он отлично работает в Firefox, но для Chrome вам нужно добавить this.value=null; после предупреждения.

0
elshnkhll