后端收不到字段八成是用了disabled而非readonly：disabled使字段不提交且无法交互，readonly仅禁编辑但可聚焦复制；select等控件不支持readonly，需用其他方案模拟。
后端收不到字段？八成是用了 disabled 而不是 readonly。这两个属性看着都能“锁住”输入框，但行为天差地别——一个只锁编辑，一个连提交都砍掉。
表单提交时，disabled 的值根本不会发到后端
浏览器在构造 FormData、执行 form.submit() 或原生 POST 时，会直接跳过所有带 disabled 属性的控件，不管它有没有 name 和 value。
-
<input name="user_id" value="123" readonly>→ 后端能收到user_id=123 -
<input name="user_id" value="123" disabled>→ 后端压根收不到这个字段 - 用
form.serialize()（jQuery）或new FormData(form)拿不到值？先查是不是写了disabled
readonly 只对文本类控件生效，select/button 加了也白加
readonly 是 HTML 规范里明确定义在 <input type="text">、<input type="password">、<textarea> 上的；其他控件不支持，浏览器直接忽略。
-
<select readonly>、<button readonly>、<input type="checkbox" readonly>—— 全无效，按钮照点、下拉照开、复选框照勾 - 想让
<select>“只读”，得用<input type="text" readonly>模拟，或 JS 禁用所有<option disabled> - 想保留 checkbox/radio 的选中态但禁交互？必须用
disabled+ 同名<input type="hidden">补值
disabled 彻底切断交互，readonly 仍可聚焦、选中、复制
disabled 元素无法获得焦点、Tab 键跳过、.focus() 静默失败、点击不触发任何事件监听器；readonly 则完全相反——它看起来和普通输入框一模一样，只是不能编辑。
立即学习“前端免费学习笔记（深入）”；
- 用户能双击选中
readonly文本、按Ctrl+C复制订单号或 API Key，这对展示型字段是刚需 -
disabled按钮的onclick根本不会执行，哪怕你绑了事件监听器也没用 - 视觉上：
disabled默认变灰 +cursor: not-allowed；readonly无默认样式变化，你得自己加 CSS（比如background: #eee）来提示用户“别改”
JS 动态控制时，写法和兼容性风险完全不同
用脚本切换状态比静态写 HTML 更容易翻车，尤其在 Safari 或旧版 WebView 中。
- 设
disabled：用el.disabled = true或el.disabled = false，别用setAttribute('disabled', '')（IE 下可能不重绘） - 设
readonly：老版 Safari 对el.readOnly = false响应慢；稳妥写法是禁用时el.setAttribute('readonly', '')，启用时el.removeAttribute('readonly') - 别同时写
readonly和disabled——disabled优先级更高，readonly被覆盖，逻辑反而难排查 - 判断状态别用
getAttribute("readonly")（返回null或字符串），始终用el.readOnly（注意大小写）布尔值
真正容易被忽略的，是 fieldset 上设 disabled 能批量禁用内部所有子控件（包括 select 和 button），语义清晰、兼容性好；而 readonly 没有这种能力，也不能跨控件生效。
