javascript - 即使正在检查其中一个 radio ，表单仍然返回 false

Question

为什么当检查其中一个性别 radio 时，表单仍然返回 false？

HTML

<form action="">
    <input class="radio_male" type="radio" name="gender" value="Male"> Male
    <br>
    <input class="radio_female" type="radio" name="gender" value="Female"> Female
    <br>
    <input type="submit" value="Submit">
</form>

JavaScript

var $ = document.querySelector.bind(document);

$('form').onsubmit = function() {
    if(!$('.radio_male').checked || !$('.radio_female').checked) {
        return false;
    } else {
        return true;
    }
}

Answer 1

您想检查是否选择了任何一个选项，所以请执行以下操作，

var $ = document.querySelector.bind(document);

$('form').onsubmit = function() {
    if($('.radio_male').checked || $('.radio_female').checked) {
        return true;
    } else {
        return false;
    }
}

链接到 jsFiddle

解释
根据您的以下条件，
if(!$('.radio_male').checked || !$('.radio_female').checked) {
您正在检查如果未选择 Female 或未选择 male 那么 false 这在逻辑上是错误的，因为总是会有 female 未选择(当选择 male 时)或 male 未选择(当选择 female 时)或两者均未选择(默认状态)，因此该条件将始终产生 true。
所以在我建议的答案中，我们首先检查是选择了 male 还是选择了 female 然后 true, 否则 false.