radio不会重复点击，问题根源在于name不一致致分组失效、change事件未过滤非主动触发、disabled时checked状态未同步清除。
radio 本身不会“重复点击”，所谓重复问题，本质是分组逻辑错乱、事件绑定不当或 DOM 状态未同步导致的误判。
radio 分组失效：name 不一致是最常见原因
浏览器靠 name 值识别同一组单选框。只要有一个 name 拼写不同（比如 theme 和 Theme）、大小写不统一、或 JS 动态生成时漏拼，就会分裂成多组，看起来像“点了 A，B 还能选”。
- 用
document.querySelectorAll('input[type="radio"]')打印所有 radio，检查每项的name属性是否完全一致（包括空格、下划线、大小写） - 避免在模板中用变量拼接
name，如name="opt_{{i}}"，容易因循环索引错位导致值不同 - 后端接收时只认
name对应的value字符串，不关心 label 文本，所以别让value是中文或含空格
change 事件被多次触发：监听位置和条件没卡住
给所有同名 radio 绑定 change 事件时，若不加判断，每次选中都会触发一次回调——哪怕只是切换组内选项，也会被当成“新操作”执行两次（旧项 uncheck + 新项 check）。
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
- 必须在事件处理函数开头加
if (!event.target.checked) return;，过滤掉非主动选中的触发 - 不要在
label上额外绑click，它会自动透传到关联的 radio；重复绑定会造成事件翻倍 - 如果用了 jQuery，
$(':radio').change(...)会为每个 radio 单独注册，不是“整组一个事件”，这点和原生addEventListener一样
视觉上“可重复选”：disabled 或 checked 状态没及时同步
禁用已选 radio 后，用户仍可能通过点击其他 label 触发新选择，但旧 radio 的 checked 状态若没手动清除，DOM 就会出现两个 checked 属性为 true 的元素——这是非法状态，浏览器行为不可靠。
- 禁用某个 radio 前，先遍历同组其他项，用
r.checked = false清掉它们的选中态 - 禁用操作建议用
element.disabled = true，而不是 CSS 隐藏或pointer-events: none，后者不阻止键盘空格触发 - 如果要“锁死整组”，直接对所有同名 radio 设置
disabled = true，并确保没有 JS 在之后又把它设回false
真正难处理的不是“怎么禁”，而是“什么时候该禁、禁哪几个”。很多 bug 来自把业务规则（比如“提交后不可改”）和 DOM 控制（比如“禁用 input”）混在一起做，结果状态残留、事件残留、表单提交时拿到的是旧值。保持 radio 的 name 干净、value 可控、change 回调轻量且带守卫，比任何防抖逻辑都管用。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
