检查正确答案后,禁用测验中的其他单选按钮

时间:2020-10-10 03:40:38

标签: javascript html radio-button

我正在使用以下代码来确定选中的单选按钮的值是否正确,然后禁用或隐藏组中的所有其他单选按钮。这个简单的设置是我为客户准备的测验的一部分。

<input type="radio" name="form[question-one]" value="f" id="question-one0" class="rsform-radio">
<label for="question-one0">Sight</label>

<input type="radio" name="form[question-one]" value="f" id="question-one1" class="rsform-radio">
<label for="question-one1">Smell</label>

<input type="radio" name="form[question-one]" value="t" id="question-one2" class="rsform-radio">
<label for="question-one2">Hearing</label>

<input type="radio" name="form[question-one]" value="f" id="question-one3" class="rsform-radio">
<label for="question-one3">Taste</label>

let radios = document.getElementsByName('form[question-one]');
radios.forEach(radio => {
    radio.addEventListener('change', () => {
        for (let i = 0; i < radios.length; i++) {
            let radiosValue = radios[i];
            if (radiosValue.checked) {
                // The correct answer is marked by the 't' value
                if (radiosValue.value == 't') {
                    // Disable or hide all radio buttons that contain the value of 'f' when checked
                } else {
                    // Incorrect answers are marked with a 'f' value
                }
            }
        }
    });
});

1 个答案:

答案 0 :(得分:0)

我不知道这是否是最佳解决方案,但是它可以解决您的问题。请将其添加到if语句中。

if (radiosValue.value == 't') {
    radios.forEach((link)=>{
        if(link.value=='f'){
            link.disabled = true;
        }
    })
}