Чат веб-разработчиков
Форма для загрузки файлов на HTML

Форма для загрузки файлов

Всем привет! В этом уроке речь мы создадим форму для загрузки файлов. Выглядеть поле для загрузки файлов может по-разному: сравните поле для загрузки фотографий во "ВКонтакте" и поле для прикрепления документов на "Госуслугах". Да, выглядят по разному, но работают на самом деле одинаково. Итак, поехали.

Для того, чтобы создать форму, позволяющую осуществить загрузку файлов, необходимо использовать тег <input> с типом file. При этом обязательно следует задать такой атрибут, как имя.

Однако, само по себе поле не может отправить файл на сервер. Чтобы это стало возможным, следует форме приписать атрибут enctype, у которого будет значение multipart/form-data:

Код доступен только после покупки курса HTML для начинающих.

А вот так будет выглядеть наше получившееся поле:
Поле для загрузки файла

Важное замечание касательно внешнего вида: поля для загрузки файла могут иметь разный внешний вид, в зависимости от того, какой операционной системой пользуется посетитель сайта. Изменению с помощью стилей внешний вид поля поддается очень тяжело (например, чтобы сделать как у ВК, придётся сильно попотеть).

Читайте также
Комментарии


Dilik
Dilik

Артем, верно?)

<form action="/upload" method="post" enctype="multipart/form-data">
<label for="upfile">Choose the file for upload:</label>
<br>
<input type="file" name="uploadingfile" id=upfile">
<br>
<input type="submit" value="Upload">
</form>