用原生html可直接构建可提交的选择题：需确保同组单选按钮name相同（如name="q1"）、各value有具体值（如value="a"），用label包裹input或for/id关联以支持点击文字选择；加required时只需任一radio添加且name一致，浏览器自动校验整组是否选中；横向排列可用label style="display:inline"实现；提交数据通过form的action和method发送，get方式可在url查看参数。
怎么用 <form></form> 搭出能提交的选择题
直接用原生 HTML 就能做出可提交的选择题，不需要 JavaScript 也能跑。关键是把 <form></form>、<input type="radio"> 和 <label></label> 搭对位置，否则点不中选项或提交不了。
常见错误：把 name 属性写成不同值，导致多个单选按钮互不影响；或者漏掉 value，后端收不到答案。
-
<input type="radio">必须同组用相同name（比如name="q1"），才能保证单选互斥 - 每个选项的
value要写具体值（如value="A"），别留空或只写中文，后端靠它识别答案 - 用
<label></label>包住<input>或用for+id关联，不然点文字没反应 -
<form></form>的action写接收地址（测试时可用action="#"看表单是否触发）
为什么 required 加了还是能提交空选项
因为 required 只作用于第一个 <input>，不是整组。单选题里“必须选一个”的逻辑得靠浏览器对同名 radio 的默认行为——只要至少一个被选中，整组就算通过验证。
所以真正有效的写法是：给同组任意一个 radio 加 required，并确保它们 name 相同。浏览器会自动检查这组有没有选中项。
- 别给每个 radio 都加
required，多余且可能干扰验证逻辑 - 如果用了
required却还能提交，大概率是name不一致，或者用了type="checkbox"混淆了单选/多选 - 测试时用开发者工具删掉所有
checked，再点提交，看浏览器是否弹提示：“请填写此字段”
怎么让选项横向排列而不是默认竖着排
默认 radio 是块级元素，换行显示。想横排，不用写 CSS 也能快速解决——把 <label></label> 改成 display: inline 或直接用内联写法。
最轻量的做法：在 <label></label> 上加 style="display:inline;margin-right:1em;"，比写外部样式快，适合新手临时调整。
- 不要用
<br>强制换行来“控制布局”，那会让结构混乱且难维护 - 避免把多个
<input>塞进同一个<label></label>，语义错乱，屏幕阅读器会读串 - 如果题目多、选项长，横排可能折行难看，优先保证可读性，别硬撑一行
提交后数据去哪了？新手常卡在这步
HTML 表单本身不处理数据，只负责打包发送。点了提交，浏览器会按 method（默认 GET）把数据拼到 URL 后面，或以请求体发给 action 地址。没有后端接收，数据就丢了。
本地测试时，用 method="GET" 最直观：提交后 URL 变成 ?q1=A&q2=B，一眼看到填了啥。这是验证前端是否写对的最快方式。
- 别指望
console.log自动打印表单值——没 JS 绑定的话，它根本不会执行 - 如果想存到本地，得加几行 JS 监听
submit事件，但那是下一步的事，先确保 HTML 结构能发出正确数据 - 真实部署时，
action必须指向真实接口（比如 PHP 文件或云函数地址），否则 404
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
