表单必须显式设置action和method属性，input等控件需有name属性，提交按钮须为type="submit"，跨表单数据需用FormData手动聚合且避免键名冲突。
form 没写 action 或 method 就会“点不动”
浏览器看到 <form></form> 标签，但没找到 action 属性时，提交行为直接失效——按钮点了没反应，控制台也不报错。这是最常被忽略的第一步。
必须显式声明：action 指向后端接收地址（如 "/login"），method 明确是 "POST" 还是 "GET"。别依赖默认值：
-
method默认是"GET"，但带密码、文件或长文本时必须用POST -
action为空或缺失，表单根本不会发请求，连 Network 面板都看不到任何记录 - 绝对路径（
"/api/submit"）比相对路径（"api/submit"）更可控，避免路由嵌套导致的 404
input 缺 name 属性 = 数据“隐身”
哪怕 <input type="text"> 看得见、填得进，只要没写 name="username"，提交时这个字段就完全不会出现在请求体里。后端收不到，不是传输问题，是前端根本没打包它。
注意几个易错点：
立即学习“前端免费学习笔记（深入）”；
-
id和class不能代替name—— 它们只用于 CSS 或 JS 选中，跟表单序列化无关 -
<select></select>和<textarea></textarea>同样要配name，否则选项或长文本照样丢 - 复选框（
type="checkbox"）多个同名时，后端收到的是数组；单选框（type="radio"）同组必须共用一个name才能互斥
提交按钮必须是 type="submit"
写成 <button>提交</button> 或 <button type="button">提交</button>，点击后表单毫无反应。因为只有 type="submit" 才具备触发表单提交的语义。
两种安全写法：
<button type="submit">登录</button><input type="submit" value="登录">
额外提醒：如果用了 JS 监听 click 并手动调 form.submit()，记得先 event.preventDefault()，否则可能触发两次提交。
跨表单提交 ≠ 多个 form 共享数据
HTML 本身不支持“把 A 表单的字段塞进 B 表单一起提交”。所谓“跨表单”，实际是指：用户在多个独立 <form></form> 中操作，但最终由 JS 汇总字段、构造请求。
这时候不要硬改 DOM 结构，推荐做法是：
- 每个
<form></form>保持语义完整（有action、method、各字段有name） - 用
FormData手动收集：比如new FormData(document.querySelector("#form-a"))，再用.append()加入其他表单字段 - 提交时用
fetch或XMLHttpRequest发送，而不是靠原生 submit 事件
真正容易被忽略的是：不同表单里的同名字段会互相覆盖，FormData 的键名冲突不会报错，只会静默丢数据。务必检查字段命名是否唯一，或在 JS 中做前缀处理。
