隐藏域是前端向后端传递已确认上下文的轻量信封，适用于页面ID、CSRF令牌等服务端生成且无需用户干预的数据，禁用于价格、权限等敏感信息，须严格匹配name/value、小写type、置于form内并避免disabled。
隐藏域不是“藏起来就安全了”的保险柜，而是前端向后端传递已确认上下文的轻量信封——用对了省事，用错了反而埋雷。
传服务端已定的信息，别传权限或价格
隐藏域适合传递后端生成、且无需用户干预的标识类数据，比如页面ID、来源渠道码、CSRF令牌、订单流水号。这些值由服务端注入，前端只负责原样提交。
- ✅ 合理：
<input type="hidden" name="order_id" value="ORD-20260724-889"> - ❌ 危险：
<input type="hidden" name="price" value="999">或<input type="hidden" name="role" value="admin">—— 用户可在开发者工具里两秒改掉，后端必须重新校验，不能信任这个值
name 和 value 缺一不可，大小写要严格匹配
浏览器只认 name 属性作为提交键名，没它就等于没这个字段；value 必须显式写出，哪怕为空字符串（value=""），否则整个字段不参与提交。
- 拼错 name 就收不到：后端写
request.form.get("user_id")，前端却写了name="userId"，必然为空 - type 必须小写且完整：
type="hidden"正确；type="HIDDEN"、type="hide"或漏写 type，都会降级成文本框，可能意外显示出来
JS 动态更新时，统一在 submit 前写入
靠 select change 或 click 事件更新 hidden 字段容易遗漏——比如用户直接点提交按钮，change 没触发，字段还是空的。
立即学习“前端免费学习笔记（深入）”；
- 推荐绑定到表单的 submit 事件开头，做一次最终同步
- 用
form.querySelector('[name="xxx"]').value = ...替代document.getElementById(...).value，避免作用域混乱 - 若 value 是 JSON 或含特殊字符（如邮箱、中文），先
JSON.stringify()再encodeURIComponent()，后端对应解码
别让它被 disabled 或脱离 form
hidden 字段一旦加了 disabled 属性，哪怕看不见，也不会提交；同样，如果 input 不在 <form></form> 标签内，或误嵌套在另一个 form 里，也收不到。
- 检查 Network → Form Data 面板，确认字段是否真实出现在提交载荷中
- 用
form="xxx"外链方式时，确保目标<form id="xxx">的 id 完全一致 - 动态创建元素时，
el.setAttribute("type", "hidden")要在设置 name 之前执行，尤其兼容旧环境
