fieldset禁用后子元素不可交互；必须直接在fieldset上写disabled布尔属性，写在父级无效，且需确保DOM真实生效并兼容可访问性。
fieldset禁用后子元素仍可交互？检查disabled是否写在正确位置
直接给 fieldset 加 disabled 属性是标准做法，但很多人误写在 form 或包裹容器上，导致无效。浏览器只识别 fieldset 自身的 disabled 属性，且必须是布尔属性（不能写成 disabled="false" 或 disabled="" 以外的值）。
-
fieldset上写disabled才生效；写在form、div或其他父级上完全没用 - 不要用
disabled="disabled"—— 虽然部分浏览器兼容，但语义不规范，建议只写disabled - 禁用后，所有内部表单控件（
input、select、textarea、button）自动变为只读+灰显+不可聚焦
Bootstrap 5 中 fieldset 禁用样式不生效？确认未覆盖 fieldset:disabled 样式
Bootstrap 5 默认对 fieldset:disabled 有基础样式（如降低 opacity），但如果你或项目 CSS 里写了 fieldset[disabled] { opacity: 1; } 或重置了 pointer-events，就会让禁用“看起来没效果”。尤其常见于自定义主题或第三方 UI 组件库冲突。
- 检查 DevTools 中
fieldset元素是否真有disabled属性（不是 class 名） - 查看 computed styles，确认
opacity和pointer-events是否被覆盖 - 避免用
!important强制恢复交互性 —— 这会破坏可访问性（screen reader 仍认为它禁用）
想禁用但保留部分控件可用？别用 fieldset disabled，改用 JavaScript 控制
fieldset 的 disabled 是全有或全无：一旦设上，内部所有控件都失活。如果你需要“禁用大部分，但留一个搜索框可输入”，就不能依赖原生 disabled，得手动控制子元素状态。
- 移除
fieldset的disabled属性 - 对需禁用的控件逐个加
disabled（如<input disabled>）或加aria-disabled="true"+ CSS 灰显 - 注意：仅靠 CSS 灰显 ≠ 真禁用，必须加
disabled或拦截event.preventDefault()，否则键盘仍可操作
Vue/React 里动态禁用 fieldset？确保响应式更新真实 DOM 属性
框架中容易犯的错是把 disabled 当作普通 prop 绑定，比如 Vue 写 :disabled="isDisabled"，但没加 .prop 修饰符，导致它被当成 HTML attribute 而非 DOM property，禁用失效。
- Vue：用
:disabled.prop="isDisabled"或v-bind:disabled.prop，确保写入 DOM property - React：直接
disabled={isDisabled}即可（JSX 会自动映射为 property） - 注意 SSR 场景：服务端渲染时若
isDisabled初始为 false，客户端 hydrate 后才变 true，可能有短暂闪动，需服务端同步状态
fieldset 看似简单，但跨框架、跨样式层、跨可访问性要求时，最容易漏掉的是「属性是否真正落到 DOM 节点上」和「是否干扰了屏幕阅读器的语义理解」。 
