formenctype 只能作用于 元素，不能单独控制按钮；文件上传必须在 上设 enctype="multipart/form-data"，否则二进制文件无法发送；多提交逻辑需用 javascript 分离处理。
formenctype 只能作用于整个 <form></form>，无法单独控制单个按钮
直接说结论：formenctype 是 <form></form> 元素的属性，不是按钮（<input type="submit"> 或 <button type="submit"></button>）的独立属性。你给某个按钮加 formenctype="multipart/form-data"，浏览器会忽略它——除非这个按钮是表单内唯一提交控件，且整个表单没设 enctype，此时部分浏览器可能“捎带”解析，但属于非标准行为，不可依赖。
常见错误现象：
– 表单有多个提交按钮，只给上传按钮加 formenctype，结果文件仍传不上去；
– 控制台没报错，但后端收不到 files 字段，request.FILES（Django）或 req.files（Express）为空。
-
enctype必须在<form></form>标签上显式声明为multipart/form-data，否则任何按钮提交都不会发送二进制文件 - 如果表单里同时有普通文本提交和文件上传需求，不能靠不同按钮切换
enctype—— HTML 不支持运行时动态切换编码类型 - 想让“上传按钮”和“保存按钮”走不同逻辑，得用 JavaScript 阻止默认提交，再手动构造
FormData并选择性 append 字段
真正可行的替代方案：用 JavaScript 分离提交逻辑
核心思路：所有按钮都设 type="button"（非 submit），点击时用 JS 判断目标操作，再决定是否收集文件、是否设置 Content-Type、发哪个接口。
示例场景：一个表单含 <input name="title"> 和 <input type="file" name="avatar">，两个按钮：“保存文字”、“上传头像”。
- 点击
saveBtn：只取title，用fetch发 JSON，Content-Type: application/json - 点击
uploadBtn：创建FormData，append('title', ...)+append('avatar', file)，用fetch直接发，不设Content-Type（浏览器自动加multipart/form-databoundary） - 注意：
FormData会自动忽略空文件输入，不用手动判断file.length > 0
为什么不能靠多个 <form></form> 套同一组字段？
有人尝试把同一个 <input name="title"> 放进两个不同 <form></form> 里，一个配 enctype="application/x-www-form-urlencoded"，另一个配 multipart/form-data。这会导致：
– 字段实际只属于最近的 <form></form> 父容器，另一个表单根本读不到它的值；
– 浏览器不允许一个控件被多个表单“共享”；
– 即使强行用 JS 跨表单取值，也破坏了语义和可访问性（screen reader 无法正确关联 label）。
- DOM 中每个表单控件只能有一个
form属性指向所属<form></form>，这是硬性限制 - 若真要物理隔离，必须复制字段（如用
hidden同步值），但维护成本高、易不同步 - 更稳妥的做法是：一个表单 + 一个 JS 提交分发器，比拆表单更轻量、更可控
容易被忽略的边界点：文件输入的 name 和空值处理
即使 FormData 构造正确，后端仍收不到文件，大概率卡在这几个细节：
-
<input type="file">必须有name属性，且和服务端约定的字段名完全一致（区分大小写、下划线） - 用户没选文件时，
input.files[0]是undefined，直接formData.append('avatar', input.files[0])会 append 一个undefined，某些后端框架（如 Flask）会静默跳过，但有些会报错 - 多文件上传时，
<input multiple>的files是FileList，需用for...of或Array.from()遍历，不能直接append整个files - 如果用
fetch发FormData，千万别手动设headers: {'Content-Type': '...'}—— 这会覆盖浏览器自动生成的带 boundary 的 multipart header，导致后端解析失败
事情说清了就结束。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
