只需在文件输入框上加multiple属性，再配合表单enctype="multipart/form-data"、前端用FileList+FormData组装、后端按同名多值解析$_FILES['files']['name'][$i]等子数组，即可实现多文件上传；它本身仅开启多选通道，不负责传输。
只需在文件输入框上加 multiple 属性，再配合表单编码、前端收集和后端解析三步，就能实现多文件上传。它本身不负责上传，只打开多选通道。
HTML结构：启用多选并规范命名
必须同时满足三个条件，否则多选无效：
-
type="file" 和 multiple 缺一不可，例如：
<input type="file" name="files[]" multiple> -
form 标签需设置
enctype="multipart/form-data"，否则文件数据不会被发送 -
name 属性建议用数组形式（如
files[]），尤其对 PHP 等框架更友好；也可用普通名（如files），但后端必须按同名多值处理
前端处理：用 FileList 和 FormData 组装数据
用户选择后，input.files 返回一个 FileList 对象（类数组），需手动转成可上传格式：
- 监听
change事件获取选中文件：const files = event.target.files; - 创建
FormData实例，遍历每个File对象，用相同字段名多次append：formData.append('files[]', file) - 可额外添加元数据，比如：
formData.append('index', i)或formData.append('category', 'report')
后端接收：按字段名提取全部文件
服务端不能只取第一个文件，必须显式支持「同名多文件」解析：
立即学习“前端免费学习笔记（深入）”；
-
Node.js（Express + multer）：用
upload.array('files[]', 10)，而非single() -
PHP：通过
$_FILES['files']['name']等子数组遍历，不是直接读$_FILES['files']['name']字符串 -
Python（Flask）：调用
request.files.getlist('files[]') - 所有情况都依赖请求头为
Content-Type: multipart/form-data（FormData自动设置）
补充要点：体验与兼容性
这些细节容易导致上传失败或仅传一个文件：
- 移动端部分旧版 Android 浏览器多选不稳定，可提示“建议使用 Chrome 或 Safari”
- 不能用 JS 直接赋值
input.files（只读），只能由用户触发选择 - 搭配
accept（如accept=".pdf,.docx"）能过滤类型，提升可用性 - 若混用
webkitdirectory，会切换为目录上传模式，与multiple互斥
