用HTML表格实现Likert五点量表需每行独立单选：题干用<th scope="row">，列头用<th scope="col">，每单元格含<input type="radio">与<label>绑定；各行radio的name属性按题隔离（如q1、q2），value为1–5；表须置于<form method="post">内，配合required与JS校验确保必填。
用 HTML 表格实现矩阵量表（如 Likert 五点量表）的单选交互，核心是让“每行独立单选”，同时保持结构清晰、语义正确、提交可用。纯表格不带交互，必须靠 <input type="radio"> 驱动，且 name 属性要按行隔离。
表格结构要语义化
用 <table> 搭骨架没问题，但关键标签不能错：
- 题干放在
<th scope="row">里，明确这是行标题 - 列头（如“非常不满意”“非常满意”）用
<th scope="col">，而非<td> - 每个评分单元格内放一个
<input type="radio">+ 对应<label>，label 用for绑定 radio 的 id - 整张表必须包裹在
<form>中，并设置method="post"和有效action
单选逻辑靠 name 分组控制
矩阵题的本质是“每道题单独选一个分值”，不是全表只能选一个。常见错误就是所有 radio 的 name 都写成一样：
- 第1题所有选项 name = "q1"，value 分别为 "1" "2" "3" "4" "5"
- 第2题所有选项 name = "q2"，value 同样设为 "1"–"5"
- 以此类推，确保每行互不影响
- 不要给同一行的 radio 设多个
checked，浏览器只认第一个
提升可用性与兼容性
光能点还不算完成，还得考虑用户实际操作和提交可靠性：
立即学习“前端免费学习笔记（深入）”；
- 每行加
required可触发浏览器必填提示，但 Safari 旧版支持弱，建议配合 JS 校验 - 移动端点击区域小？用
<label>包裹文字+radio，或设 label 的for属性，点文字也能选 - 所有 radio 必须有
name和value，否则后端收不到字段或值为空字符串 - 避免混用
type="radio"和type="number"在同一行——会破坏表单逻辑，后端无法统一解析
提交前简单校验示例
可加一段轻量 JS，检查是否每行都有选择：
- 遍历所有
tr，对每行查找input[name^="q"]:checked - 若某行没匹配到，就高亮该行并提示“请为【XX问题】评分”
- 提交按钮用
<button type="submit">，别用type="button"
