HTML单选按钮异常咨询：同一问题可同时选中YES和NO的解决方法

嘿，这问题我太熟了！你遇到的核心问题是单选按钮的分组逻辑没搞对——单选按钮要实现「二选一」的互斥效果，必须让同一问题下的YES和NO共享同一个name属性。你现在给每个选项单独设置了不同的name（比如1yes、1no），浏览器会把它们当成完全独立的两组，自然能同时选中啦。

我帮你修正了代码，主要调整了这几点：

• 每个问题下的两个单选按钮统一使用相同的name（比如q1、q2），确保同一问题的选项属于同一组
• 修复了原代码里<class="right">的语法错误，改成用<span class="right">包裹选项来实现样式定位
• 给每个单选按钮新增了value属性，这样提交表单时能拿到明确的选中值
• 把所有问题放在同一个<form>标签下，结构更规范（如果需要单独提交每个问题，也可以拆分，但统一包裹更符合常规场景）

修正后的代码 #

<form>
  <ul>
    <li>
      Question 1
      <span class="right">
        <input type="radio" name="q1" value="yes" /> YES
        <input type="radio" name="q1" value="no" /> NO
      </span>
    </li>
    <li>
      Question 2
      <span class="right">
        <input type="radio" name="q2" value="yes" /> YES
        <input type="radio" name="q2" value="no" /> NO
      </span>
    </li>
    <li>
      Question 3
      <span class="right">
        <input type="radio" name="q3" value="yes" /> YES
        <input type="radio" name="q3" value="no" /> NO
      </span>
    </li>
    <li>
      Question 4
      <span class="right">
        <input type="radio" name="q4" value="yes" /> YES
        <input type="radio" name="q4" value="no" /> NO
      </span>
    </li>
  </ul>
</form>

额外小提示：如果需要默认选中某个选项，给对应的单选按钮加上checked属性即可，比如：

<input type="radio" name="q1" value="yes" checked /> YES

内容的提问来源于stack exchange，提问作者btm2424