<input type="file" multiple>
The <input type="file" multiple> HTML element shows a file picker from which users can choose one or more files to upload with a form.
Overview
The <input type="file" multiple> HTML element shows a file picker from which users can choose one or more files to upload with a form.
Browser support
| Feature | Desktop | Mobile | ||||
|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Chrome Android | Safari iOS | |
| 2 | 12 | 3.6 | 4 | 18 | 3.2 | |
| HTML attribute | ||||||
| The Boolean multiple attribute, if set, means the form control accepts one or more values. The attribute is valid for the input/email and input/file input types and the select. The manner by which the user opts for multiple values depends on the form control. | 2 | 12 | 3.6 | 4 | 18 | 3.2 |
| DOM API | ||||||
| The read-only webkitEntries property of the HTMLInputElement interface contains an array of file system entries (as objects based on FileSystemEntry) representing files and/or directories selected by the user using an input element of type file, but only if that selection was made using drag-and-drop: selecting a file in the dialog will leave the property… | 22 | 79 | 50 | 11.1 | 25 | 11.3 |
Syntax
<label>Select files (multiple selections allowed):
<input type="file" multiple accept="image/*">
</label>
<script>
document.querySelector('input[type=file]').addEventListener('change', (e) => {
console.log('選択数:', e.target.files.length);
});
</script>Live demo
Multiplefileselection
Multiple attribute in multiplefile simultaneous to selectionpossible to.
Accept and. combination
specifictype. Multiplefile selection. with multiple + accept
Use cases
Using <input type="file" multiple>
The <input type="file" multiple> HTML element shows a file picker from which users can choose one or more files to upload with a form.
Cautions
- May not be supported in older browsers.
Accessibility
- Verify how this element is announced by screen readers.
Related links
Powered by web-features