单选是默认行为，不加multiple属性即可；多选必须显式添加multiple属性，且不能写成multiple="false"或拼错为multiples。
单选是默认行为，不加 multiple 就对了；多选必须显式写 multiple，且不能写成 multiple="false" 或拼错为 multiples。
为什么没写 multiple 就是单选
HTML 规范把 multiple 定义为布尔属性 —— 它的存在本身即触发多选逻辑。只要 DOM 中没这个属性，浏览器就原生限制只能选一个文件，哪怕用户按住 Ctrl 多选、框选多个，最终也只保留最后一个。
- 单选写法：
<input type="file" name="avatar"> - 多选写法：
<input type="file" name="attachments" multiple> - 错误写法：
multiple="false"（写了就生效，值无效）、multiples（拼错，被忽略） - 检查方式：用开发者工具 inspect 元素，确认 DOM 里真没
multiple属性
React/Vue 等框架里怎么防误开多选
框架模板或 JSX 中容易因动态绑定让 multiple 意外出现，比如 multiple={isMulti} 且 isMulti 被设为 true 或 "1" 这类真值。
- Vue 模板中避免：
<input type="file" :multiple="isMulti">，除非你明确需要条件多选 - React JSX 中注意：
multiple={isMulti}和multiple={true}效果一样，都开启多选 - 稳妥写法：单选场景下直接不写
multiple，不要用任何绑定 - 上线前建议在浏览器里右键「检查」，看渲染后的实际 HTML 是否含该属性
accept 属性和单/多选完全无关
accept 只影响文件对话框里默认显示的类型过滤项，它既不限制选择数量，也不阻止用户手动切到“所有文件”绕过过滤。
- 写
accept="image/*"后仍可选多个图片（如果开了multiple），也可选一个 PDF（如果没开multiple） - iOS Safari 下
accept="image/*"可能同时弹出相机和图库，要锁定前置摄像头得加capture="user" - 后端永远不能信任
accept的结果，必须重验file.type和file.name扩展名
服务端收不到多个文件？先查前端 FormData 构造
即使 <input multiple> 正确，后端收不到多个文件，大概率是 FormData.append() 用错了。
- 错误做法：
formData.append('file', files[0])只传第一个；或append('file[0]', files[0])带索引，后端解析失败 - 正确做法：循环追加同名 key，如
for (const file of files) formData.append('files', file) - PHP 接收：
$_FILES['files']['name']是数组；Node.js（Express + multer）需用upload.array('files')；Flask 用request.files.getlist('files') - 关键点：
input.files.length必须 > 1，才能说明前端确实选了多个 —— 别看input.value，它永远只显示第一个文件名
真正容易被忽略的是：很多人盯着 accept 或 required 调试，却忘了最底层的 multiple 属性是否真的没出现在最终 DOM 里。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
