Question

我正在尝试对注册表单进行验证，但我在javascript中使用单选按钮进行了性别验证问题。我希望有人能帮助我解决这个问题：D

这是我的代码

function validate(form)
{
    var genderM=form.gender_male.value;
    var genderF=form.gender_female.value;

    if(genderM.checked==false && genderF.checked==false )
       {
            alert("You must select male or female");
            return false;
       }   
 }

Answer 1

你有一个错字。您在第二次分配时使用了性别M两次而不是性别

   function validate(form)
    {
        var genderM=form.gender_male.value;
        var genderF=form.gender_female.value; //error here

        if(genderM.checked==false && genderF.checked==false )
           {
                alert("You must select male or female");
                return false;
           }   
     }

Answer 2

您还需要删除.value的

function validate(form)
{
    var genderM=form.gender_male;
    var genderF=form.gender_female;

    if(genderM.checked==false && genderF.checked==false ) {
        alert("You must select male or female");
        return false;
    }   
}

Answer 3

你可以这样做：

HTML：

<form name="foo">
    <input name="gender" type="radio" value="m" /> Male
    <input name="gender" type="radio" value="f" /> Female
    <input type="button" onclick="validateGender()" value="validate" />
</form>

JavaScript的：

<script>
    function validate(form) {
        var gender = form.querySelectorAll('input[name="gender"]:checked');
        if (!gender.length) {
            alert('You must select male or female');
            return false;
        }
    }
</script>

Demo

希望这有帮助。

编辑：我编辑了脚本，因此表单现在作为脚本中的参数传递。

Answer 4

如果没有看到相关的HTML和相关的事件分配，那么您可能正在寻找类似这样的示例。

HTML

<form id="test">
    <label for="gender">Gender:</label>
    <input type="radio" name="gender" value="0">Male</input>
    <input type="radio" name="gender" value="1">Female</input>
    <input type="submit" value="Submit">
</form>

的Javascript

function validate(form) {
    var isChecked = Array.prototype.some.call(form.querySelectorAll('input[name=gender]'), function (radio) {
        return radio.checked;
    });

    if (!isChecked) {
        alert("You must select Male or Female");
    }

    return isChecked;
}

document.getElementById('test').addEventListener('submit', function (evt) {
    if (!validate(evt.target)) {
        evt.preventDefault();
    }
});

在jsFiddle

上

javascript性别验证

4 个答案: