Почему «HTML <input type = 'file' />» имеет свойство «files» в JavaScript?

Question

Рассмотрим этот фрагмент HTML:

<input type='file' id='fileUpload' />

Чтобы получить доступ к этому элементу управления в JavaScript, мы можем написать:

var temp = document.getElementById('fileUpload');

ОК, не сердитесь, я знаю, вы все это знаете. Но интересно то, что переменная temp теперь имеет свойство с именем files, (не file , а files , форма множественного числа), которое имеет тип FileList что, конечно, является списком File объектов. Это семантически должно означать, что загрузка нескольких файлов с помощью одного и только одного элемента управления загрузкой файлов HTML должна быть возможной. Тем не менее, вы не можете загрузить несколько файлов таким способом, и есть много обходных путей, а не прямое использование.

Как вы объясните этот парадокс?

Обновление: я построил jsfiddle , чтобы увидеть один из ответов в действии.

Answer 1

В HTML5 атрибут нескольких указывает, что для поля ввода можно выбрать несколько значений.

<input type='file' multiple='multiple' />

Эти ссылки должны помочь:

http://www.w3schools.com/html5/html5_form_attributes.asp

http://rakaz.nl/2009/08/uploading-multiple-files-using-html5.html

Answer 2

Согласно справочнику Gecko , он применим только при использовании элемента загрузки файла с помощью drag-n-drop.

Answer 3

Чтобы мы могли читать на клиенте содержимое файлов, выбранных таким образом:

https://developer.mozilla.org/en/Using_files_from_web_applications

Это возможно в Firefox начиная с версии 3.0.В то время, когда я написал обширную статью о том, как делать реальные загрузки файлов Ajax: http://igstan.ro/posts/2009-01-11-ajax-file-upload-with-pure-javascript.html

В настоящее время API Firefox 3.0 удален.Вместо этого вы должны использовать FileReader вместе с объектом FormData.Это должно работать в последней версии браузера.Я не проводил обширных исследований, но я полагаю, что ни одна версия IE еще не реализует ничего из этого.