原生 radio 实现判断题需 name 唯一、value 为 "true"/"false"、required 配合无 checked 初始状态；name 大小写/空格敏感，value 须严格匹配字符串，required 生效前提为整组无默认选中，推荐 label 包裹和 :checked 伪类获取值。
直接用原生 <input type="radio"> 就能做真假判断题，不需要框架、不靠 JS 模拟逻辑——关键在 name、value 和 required 的配合是否干净。
name 必须唯一 per 题，且大小写/空格零容忍
每道判断题是一个独立 radio 组，name 值必须全局唯一（如 q1、q2），不能复用，也不能拼错。
- ✅ 正确：
<input type="radio" name="q5" value="true">和<input type="radio" name="q5" value="false"> - ❌ 错误：
name="Q5"（大小写不一致）、name="q 5"（含空格）、name="question5"（前后端字段名不匹配） - 同一组内若出现两个不同
name，浏览器就当它们是两组，用户可能同时选中“true”和“false”，提交时后端收到两个同名参数（实际只取最后一个）
value 必须是字符串 "true"/"false"，别用 1/0 或 yes/no
后端比对答案时通常用严格相等（===），如果前端传 value="1"，后端写 if (answer === "true") 就永远进不去分支。
- ✅ 正确：
value="true"和value="false"（全小写、带英文双引号） - ❌ 错误：
value="True"（首字母大写）、value="correct"、value="1" - 不要依赖 JS 转换：提交前用 JS 把
"1"改成"true"是补救，不是设计；源头就该写对
required 生效的前提：整组初始无 checked
加了 required 却还能空提交？八成是因为某处悄悄写了 checked 的隐藏 radio，比如 <input type="radio" name="q7" style="display:none;" checked>。
立即学习“前端免费学习笔记（深入）”；
- 浏览器只要发现同名组里有任意一个
checked，就认为字段已填，跳过验证 - ✅ 正确做法：所有 radio 初始都不带
checked属性，仅给需要默认选中的项显式加上（且仅加一个） - ❌ 错误惯性：
checked=""、checked="false"、checked="0"—— 这些都会触发选中，因为 HTML 只看属性是否存在 - 移动端或无障碍场景下，更推荐用
<label><input>正确</label>包裹结构，避免for/id绑定出错
获取选中值别遍历，用 :checked 伪类一步到位
JS 里想读用户选了“true”还是“false”，不用 querySelectorAll 再循环判断 checked，既慢又容易漏 null。
- ✅ 推荐写法：
document.querySelector('input[name="q3"]:checked')?.value - 返回
null表示没选，可直接用于防提交或提示 - 如果用了框架（如 Vue/React），确保绑定的变量初始为
undefined或null，而不是空字符串或默认"true"，否则会掩盖未选状态
最容易被忽略的是：name 冲突和隐藏 checked 共存时，表单验证完全失效，但控制台不报错、页面无提示——这种问题只能靠人工逐行检查 HTML 结构，没法靠 console.log 看出来。
