加multiple属性是唯一前提，必须与type="file"共存且form设enctype="multipart/form-data"；name建议用files[]；ios 16.4以下静默失效；filelist需转数组遍历；formdata同名append需后端支持多值解析。
加 multiple 属性是唯一前提，没它浏览器根本不允许一次选多个文件——这不是 JS 能补救的限制，是原生行为。
为什么加了 multiple 还是只能传一个文件
常见错误不是代码写错，而是漏掉配套条件：
-
multiple必须和type="file"同时存在，单独写multiple无效 -
<form></form>必须设enctype="multipart/form-data"，否则文件数据压根不会发出去 -
name建议带[]，例如name="files[]"；不带的话，PHP 会覆盖同名字段，只留最后一个文件的信息 - iOS Safari 在 16.4 以下版本会静默忽略
multiple，用户点了半天还是单选——检测 UA + 提示升级或换浏览器是唯一办法
input.files 不是数组，别直接调 .forEach()
它是个 FileList 对象，类数组但没有数组方法，直接用会报 "not a function"：
- 安全转成数组：用
Array.from(input.files)或[...input.files] - 遍历时别依赖
value——它只返回第一个文件的伪造路径（如C:\fakepath\photo.jpg），真正要读的是input.files - 每个
file是File实例，有name、size、type、lastModified，可用于实时校验（比如选了 50 个文件，别等点击上传才提示“超限”）
用 FormData.append() 传多个文件时 key 名怎么写
后端能否收到全部文件，取决于你往 FormData 里怎么 append：
- ❌ 错误写法：
formData.append('files', file1); formData.append('files', file2)—— 大多数后端（如 Express 默认配置）会把同名 key 当作单值，只保留最后一次 - ✅ 正确写法：用相同 key 名多次 append，例如
formData.append('files', file1); formData.append('files', file2)，但后端必须启用「同名多值」解析（Express 用upload.array('files')，不是upload.single()；PHP 遍历$_FILES['files']['name']数组） - 别手动设置
Content-Type请求头，让浏览器自动生成multipart/form-data和 boundary - 调试时务必打开 Network 面板，看 Request Payload 里是否每个文件都作为独立条目出现，而不是合并成一个 blob
最易被忽略的点：iOS 16.4 以下无解，不是前端能绕过的；还有就是后端解析逻辑错位——前端明明传了 5 个文件，后端却只取 req.file 或 $_FILES['files']['name'] 字符串，结果永远只有第一个。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
