同页展示的多选测验切换题目时如何保持radio buttons选中状态？

你遇到的选中状态丢失问题和表单验证无关，也不需要补充特殊的表单声明，核心是单选按钮分组配置、或者题目切换的DOM操作逻辑有问题，按下面的优先级排查即可：

• 首先确认每道题的单选按钮name属性唯一区分：
  同组单选的name必须一致，不同题目的单选name必须不同，否则浏览器会把多道题的单选识别为同一组，切换选择时会自动取消其他题的选中值。如果你的测验题目存储在多维关联数组里，可以用题目ID作为name的区分后缀，比如question_1、question_2，示例（PHP场景）：

foreach ($quizList as $qid => $item) {
    echo '<div class="question-card">';
    echo "<p>{$item['question']}</p>";
    foreach ($item['options'] as $val => $text) {
        // 提交后回显也可以用这个逻辑加checked属性
        $checked = (isset($_POST["question_{$qid}"]) && $_POST["question_{$qid}"] == $val) ? 'checked' : '';
        echo "<label><input type='radio' name='question_{$qid}' value='{$val}' {$checked}> {$text}</label>";
    }
    echo '</div>';
}

• 调整题目切换逻辑，不要销毁DOM：
  如果你的切换逻辑是每次只渲染当前题目、销毁其他题目的DOM，选中状态自然会丢失。改成提前用foreach把所有题目全部渲染到页面，默认仅展示当前题目，其他题目加display: none做隐藏，切换时仅修改元素的显隐状态，无需重绘DOM，浏览器会自动保留所有单选的选中状态。
• 若必须重绘DOM，新增全局变量存储选中值：
  如果业务逻辑要求切换题目时必须重新渲染DOM，可以监听单选的change事件，把每道题的选中值存储在全局对象中，每次渲染题目时，从全局对象中取出对应题目的选中值，主动给对应选项加上checked属性即可，示例JS逻辑：

// 全局存储所有题目的选中值
const userAnswers = {};
// 监听所有单选的选择操作
document.addEventListener('change', e => {
    if(e.target.type === 'radio' && e.target.name.startsWith('question_')) {
        const qid = e.target.name.split('_')[1];
        userAnswers[qid] = e.target.value;
    }
});
// 渲染题目时主动匹配选中值
function renderSingleQuestion(qid) {
    // 此处省略获取题目数据的逻辑
    const selected = userAnswers[qid] || '';
    // 渲染选项时判断值等于selected则加checked属性
}

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