radio无法取消选中时需手动清空同name组：用querySelectorAll获取全部radio并设checked=false，同时removeAttribute('checked')；name不一致会导致多选，须严格统一大小写与空格。
radio点错了怎么手动取消再选？
不能靠“再点一次”取消——radio 本身不支持取消选中，必须先让同组其他项被选中，或手动清空当前组。浏览器不会提供“取消全部”的交互入口，这是设计使然。
实操建议：
- 确保所有同
name的input[type="radio"]都在 DOM 中可访问，否则 JS 找不到它们 - 用
document.querySelectorAll('input[name="xxx"][type="radio"]')获取整组，再遍历设el.checked = false - 若该组 HTML 中有写死的
checked属性（比如<input checked>），仅 JS 设false不会视觉还原，得同步调用el.removeAttribute('checked') - 不要用
el.checked = undefined或删属性后不设false，部分老浏览器（如 IE11、Android 4.4 WebView）不识别
为什么点了别的选项，之前选中的没取消？
根本原因是 name 属性不一致：大小写、空格、拼写差一个字符，浏览器就认为是两组独立控件。这不是 JS 问题，是 HTML 结构错误。
常见错误现象：
立即学习“前端免费学习笔记（深入）”；
- 点“男”后点“女”，两个都保持选中状态
- 表单提交时后端收不到值，Network 查 payload 没对应
name字段 - 用 DevTools 看元素，发现部分
radio根本没name属性，或写成NAME/name_
检查要点：
DeepBI DHTML 页面生成器
下载
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
- 所有同组
radio的name值必须完全相同（含大小写、无前后空格） - 确认没有漏写
name，尤其动态插入的节点 - 避免用框架模板语法意外截断属性，比如 Vue 的
v-bind:name="xxx"为空时渲染出无name的标签
form.reset() 后 radio 还是点不了？
form.reset() 只恢复 HTML 中写死的 checked 状态，但不会动 disabled、readonly 或父级 fieldset[disabled] ——这些都会让 radio 失效。
容易踩的坑：
- 提交后 JS 给 radio 加了
disabled = true，重置完依然不可点 - 整个 radio 组被包在
<fieldset disabled></fieldset>里，比单个disabled更难排查 - 用 React/Vue 等框架时，
form.reset()只改 DOM，state 没变，看起来“没重置”
修复方式：
- 重置前缓存初始
disabled状态：const initDisabled = el.disabled - 监听
reset事件，在回调里用setTimeout(() => { el.disabled = initDisabled }, 0)恢复 - 框架项目中，别依赖原生 reset；直接设 state 变量（如
selected = ''），让视图驱动 DOM 更新
页面刷新后 radio 选中状态丢了怎么办？
这是默认行为，不是 bug。DOM 重载只认 HTML 中的 checked 属性，JS 动态设置的全丢。要恢复，必须自己存取。
关键细节：
- 存的时候用
localStorage.setItem(radio.name, radio.value)，别用radio.id或随机 key - 恢复时不能只查
querySelector('input[value="xxx"]')，得先拿同name的所有radio，再比对value - DOM 必须就绪后再执行恢复逻辑，否则
querySelectorAll返回空列表；用DOMContentLoaded最稳妥 - 多个 radio 组共用一个
name（比如都叫status）会导致互相覆盖，务必保证name全局唯一
最常被忽略的一点：label 标签未闭合或嵌套标题标签（如 <label><h3>性别</h3></label>），会让浏览器解析错乱，把点击事件错误分发到多个 radio 上，造成“点哪都清空”的假象。这种问题无法靠 JS 修复，必须改 HTML 结构。
