form属性值必须严格匹配目标form的id，否则静默失败；跨表单提交需确保按钮type为submit、form属性正确、目标form存在id，且通过name/value区分操作意图。
form 属性写错 ID 就静默失败，不报错也不提交
浏览器只认 form 属性值是否严格匹配页面中某个 form 元素的 id，大小写、下划线、连字符全算不同字符串。比如按钮写了 form="user-form"，但目标表单是 ，点击后什么都不会发生——控制台没错误，网络面板没请求，表单数据也没发出去。
常见排查点：
- 用开发者工具检查目标
form是否真有id属性（不是name或class） - 确认按钮不在任何
form标签内部（否则form属性被忽略） - 检查按钮类型是否为
type="submit"或type="image"；type="button"再配form也无效
多个按钮共用同一 form 属性，后端靠 name/value 区分操作意图
跨表单提交本身不传递按钮自身语义，它只把目标表单内控件的数据发出去。要让后端知道“用户点了哪个按钮”，得靠按钮自己的 name 和 value。
正确做法是给每个跨表单按钮设唯一 name：
这样后端收到的请求体里就会带 action=save_draft 或 action=publish，而不仅仅是表单字段。
注意：
- 别用中文
value做判断依据，编码不一致时容易出错 - 如果两个按钮
name不同（如name="save"和name="delete"），后端只需检查对应 key 是否存在即可，更稳定 -
formaction可覆盖目标表单的action，实现同一表单不同按钮走不同接口
event.submitter 在 submit 事件里才可靠，且 Safari 旧版不支持
JavaScript 监听表单的 submit 事件时，event.submitter 会指向触发这次提交的那个带 form 属性的按钮（前提是它是 type="submit"）。这是目前最干净的前端区分方式。
但要注意：
- 必须监听
的submit事件，不是按钮的click - Safari 15.4 之前版本不支持
event.submitter，需降级用data-action+click手动标记 - 若用
form.submit()方法调用提交，event.submitter恒为null，无法溯源 - 按钮在弹窗或页脚等任意位置都行，只要
form属性有效，event.submitter就能取到
按钮嵌套在另一个 form 里也能跨提交，但 disabled 字段会被自动过滤
一个常见误解是“按钮必须放在表单外面”。其实只要它没被包裹进目标表单，哪怕它在另一个 form 标签里，甚至嵌套在 dialog 或 shadow DOM 中，只要 form="target-id" 正确，就能触发目标表单提交。
不过提交时浏览器只收集目标 form 内部的可提交控件，且自动跳过所有 disabled 状态的字段。这意味着：
- 你不能靠禁用某个 input 来“临时隐藏”它再手动加进提交数据——它根本不会出现在请求体里
- 如果想让某字段“逻辑上禁用但物理上提交”，得用
readonly替代disabled，或 JS 动态移除disabled属性 - 按钮自身的
name/value仍会随表单一起发送，不受其所在 DOM 位置影响
实际最难处理的，是既要支持纯 HTML 提交兜底，又要兼容 JS 增强交互的场景——这时候 form 属性和 event.submitter 的配合边界特别容易模糊，稍不注意就出现“点按钮没反应”或“点一次发两次请求”。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
