禁用控件用disabled（值不提交），只读展示用readonly（值可提交、支持聚焦复制）；fieldset可批量禁用；checkbox/radio不支持readonly，禁用时需同步处理label视觉与aria-disabled以保障可访问性。
禁用表单控件：用 disabled 属性，但别忘了它会阻止表单提交
给 <input>、<select></select> 或 <textarea></textarea> 加 disabled 属性，Bootstrap 会自动加上灰阶背景和低透明度样式，视觉上明确表示不可交互。但关键点是：disabled 元素的值**不会被包含在表单提交数据中**，哪怕你在 JS 里改了它的 value，后端也收不到。
常见错误现象：表单校验通过了，但后端发现某个字段为空——其实是前端误用了 disabled 而非 readonly。
- 只读场景（如展示用户手机号但不允许修改）→ 用
readonly，值仍可提交 - 彻底禁用（如等待接口返回前锁住提交按钮）→ 用
disabled - 对
<fieldset></fieldset>使用disabled，能批量禁用内部所有控件，比逐个加更可靠 - JS 动态控制时，用
element.disabled = true，别只改 class；否则语义丢失，屏幕阅读器和表单序列化都受影响
readonly 输入框：支持聚焦和复制，但不能编辑
readonly 只对 <input> 和 <textarea></textarea> 有效，<select></select> 不支持该属性。Bootstrap 默认会给 readonly 输入框加浅蓝边框（border-color: #80bdff），和普通状态区分开。
使用场景多见于「预填+确认」流程，比如地址自动填充后让用户核对再提交。注意它和 disabled 的核心区别：readonly 元素仍可获得焦点、可被选中、可复制内容，且值照常提交。
-
<input type="checkbox">和<input type="radio">不支持readonly，只能用disabled或 JS 拦截点击 - 若需视觉上更接近
disabled（比如不想让边框变蓝），可额外加 classbg-light text-muted，但别删掉readonly属性本身 - 某些旧版 IE 对
readonly的 focus 行为不一致，如必须兼容，建议统一用disabled+ 隐藏域（<input type="hidden">）补值
自定义状态样式：覆盖 Bootstrap 的 :disabled 和 [readonly] 规则要小心
Bootstrap 的禁用/只读样式来自 CSS 伪类和属性选择器，比如 input:disabled 和 input[readonly]。如果你在项目里写了全局重置（比如 input:disabled { opacity: 1; }），很容易意外破坏所有表单控件的状态表现。
性能影响不大，但兼容性隐患明显：不同浏览器对 :disabled 的继承规则略有差异，而 [readonly] 在部分移动端 WebView 中可能不触发样式匹配。
- 优先用 Bootstrap 自带的
.form-control:disabled或.form-control[readonly]选择器做微调，避免泛写input:disabled - 若需统一禁用态灰度，推荐用
filter: grayscale(0.5)而非直接调opacity，后者会影响可访问性（屏幕阅读器可能跳过低透明元素） - 不要用 JS 动态移除
disabled属性来“启用”控件——应同时恢复其初始tabindex和事件监听，否则键盘用户无法 tab 到它
复选框和单选按钮的禁用处理：只靠 disabled 不够直观
Bootstrap 对 <input type="checkbox"> 和 <input type="radio"> 的 disabled 支持是基础级的：勾选框本身变灰，但关联的 <label></label> 文字默认不变色，用户可能点文字却没反应，产生困惑。
真实使用中，这类控件常出现在权限控制或条件依赖场景（如“开启通知”开关被父级策略禁用）。光加 disabled 往往不够，需要主动干预视觉反馈。
- 给包裹
<input>的<label></label>同时加disabledclass（如text-muted），或用 CSS 规则label input:disabled + span { opacity: 0.6; } - 不要仅靠 JS 绑定
click事件并return false来模拟禁用——这绕过了原生语义，辅助技术无法识别 - 如果禁用逻辑复杂（比如多个条件组合），建议用
aria-disabled="true"配合视觉样式，确保屏幕阅读器能播报状态
最易被忽略的是：禁用复选框后，它的 checked 状态依然存在，JS 读取 element.checked 仍返回布尔值。别假设“禁用=未选中”，该判断必须独立做。
