button 的 form 属性仅对 type="submit"（或省略 type）有效，且必须严格匹配目标表单的 id；它支持跨表单提交，但仅采集目标表单内可提交控件的数据，兼容主流浏览器，调试需重点验证 id 是否存在且拼写一致。
button 的 form 属性必须配 type="submit"
不设 type 或设成 type="submit" 才能触发提交；type="button" 再加 form 也完全无效。这是最常被忽略的前提——很多页面里按钮写了 form="my-form" 却没生效，翻来覆去检查 ID 拼写，最后发现是 type="button" 在“装死”。
常见错误现象：<button form="login-form">登录</button> 点击无反应，控制台静默，连 submit 事件都不触发。
- 显式写
<button type="submit" form="login-form">登录</button> - 省略
type也行（浏览器默认就是submit），但建议显式写出，避免团队协作时歧义 -
form属性只对<button></button>、<input type="submit">、<input type="image">三类元素有效
form 属性值必须严格匹配目标表单的 id
form 属性不是 CSS 选择器，它只认 id，且大小写、空格、连字符都必须一字不差。页面里写 id="searchForm"，按钮却写 form="search-form"，就彻底失效。
容易踩的坑：
立即学习“前端免费学习笔记（深入）”；
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
- 目标
<form></form>缺少id属性（只写了name或class） - 拼写不一致：比如
id="user-login"vsform="user_login" - ID 值含空格或非法字符（如中文、emoji），HTML 不允许，浏览器会忽略该属性
- 多个表单用了重复
id，浏览器只取第一个，行为不可预测
按钮位置完全自由，但数据只来自目标表单内部
按钮可以放在页脚、弹窗里、甚至另一个 <form></form> 内部，只要 form="target-id" 正确，点击后收集的数据就**只来自 id="target-id" 表单内的可提交控件**（<input>、<select></select>、<textarea></textarea> 等），和按钮物理位置毫无关系。
这意味着：
- 按钮在
<form id="a"></form>里，但form="b"，提交的是b表单的数据 - 按钮自身
name和value不会随表单一起发送（除非用formaction触发 submit 事件并手动注入） -
disabled的控件不会被包含，required校验仍生效，submit事件仍能监听
兼容性与 event.submitter 的实际表现
Chrome 10+、Firefox 4+、Safari 5.1+、Edge 12+ 全支持，无需 polyfill。但要注意 event.submitter 在 Safari 15.4 之前不支持——如果你在 <form></form> 的 submit 事件里靠它区分不同提交按钮（比如“保存草稿” vs “正式提交”），旧版 Safari 用户会拿到 null。
替代方案：
- 给按钮加
data-action="draft"，在 click 事件里先记录状态，再触发提交 - 用
formmethod="post"或formaction="/api/draft"直接覆盖行为，比 JS 判断更轻量 - 避免依赖
event.submitter做核心逻辑，它本质是增强型信息，不是基础设施
<form></form> 是否真有对应 id，且没有被 JS 动态删改过。 
