Для того чтобы вывести на экран несколько файлов с помощью элемента input
с типом file
в JavaScript, можно воспользоваться следующим подходом:
1. Создайте HTML разметку, в которой будут несколько элементов input
с типом file
:
<input type="file" id="file-input1" multiple> <input type="file" id="file-input2" multiple>
Здесь мы создали два элемента input
, каждый из которых позволяет выбирать несколько файлов (атрибут multiple
).
2. Добавьте обработчик события на изменение значения в любом из элементов input
:
<script> document.getElementById('file-input1').addEventListener('change', handleFilesSelect); document.getElementById('file-input2').addEventListener('change', handleFilesSelect); function handleFilesSelect(event) { const files = event.target.files; for (let i = 0; i < files.length; i++) { console.log(`Выбранный файл: ${files[i].name}`); } } </script>
Функция handleFilesSelect
будет вызываться каждый раз, когда пользователь выбирает файлы в любом из элементов input
. Внутри функции мы получаем список выбранных файлов через свойство files
объекта события и выводим их имена в консоль.
Таким образом, при выборе файлов в любом из элементов input
с типом file
, их имена будут выведены в консоль. При необходимости, вы можете изменить способ обработки выбранных файлов, например, загрузить их на сервер или выполнить другие действия.