单选按钮验证：javascript

我有一张登记表，想在性别部分单选按钮上添加验证。 我的表格是

<form name="formreg" enctype="multipart/form-data" method="post">
     <input type="radio" value="male" name="gender" /> Male<br />
      <input type="radio" value="female" name="gender" /> Female<br />
      <input value="Submit" onclick="return inputval()" type="submit" />
    </form>

男性

女性

我使用下面的脚本，但工作不正常

<script type="text/javascript">
     function inputval(){
        if(document.getElementById("gender").checked=="false")
        {
            alert("Select at least male or female.");
            return false;
        }   
    }
    </script>

函数inputval（）{
if（document.getElementById（“性别”）.checked==“false”）
{
警惕（“至少选择男性或女性。”）；
返回false；
}   
}

---

找不到问题。

您按Id获取元素，“性别”是您输入的名称，而不是Id。
而不是

<input type="radio" value="male" name="gender" /> Male<br />

男性

你应该使用

<input type="radio" value="male" id="gender" /> Male<br />

男性

尝试使用

：选中的
：

<script type="text/javascript">
 function inputval(){
    if($(':checked').length < 0)
    {
        alert("Select at least male or female.");
        return false;
    }   
}
</script>


函数inputval（）{
如果（$（':checked'）。长度<0）
{
警惕（“至少选择男性或女性。”）；
返回false；
}   
}
既然您用jquery标记了它，请使用
：checked
伪类选择器

<script type="text/javascript">
function inputval()
{
    if($("form[name='formreg'] input[type='radio']:checked").length != 1)
    {
        alert("Select at least male or female.");
        return false;
    }
}
</script>


函数inputval（）
{
if（$（（$（form[name='formreg']input[type='radio']：checked”）.length！=1）
{
警惕（“至少选择男性或女性。”）；
返回false；
}
}
您将jQuery放下，因此我将使用它<代码>文档。getElementById（'checked'）
不存在。即使有，它也只适用于一个元素。您必须迭代每个
[name=gender]
元素，以查看是否选中了任何元素。jQuery使这一点变得微不足道：

$(".inputval").on('click', function (e) {
    if (!$("[name=gender]:checked").length) {
        alert('something something gender');
        e.preventDefault();
    }
});


编辑：非jQuery解决方案也非常简单，因为
querySelectorAll（'[name=gender]：checked'）
也可以工作。
不需要验证。默认情况下，选中一个单选按钮

<form name="formreg" enctype="multipart/form-data" method="post">
     <input type="radio" value="male" name="gender" checked="true" /> Male<br />
      <input type="radio" value="female" name="gender" /> Female<br />
      <input value="Submit" onclick="return inputval()" type="submit" />
    </form>


男性

女性

这把小提琴可以给你一些想法（没有jquery）。请注意，我选中了其中一个按钮，因此我可以向您显示，如果选中了一个按钮，它将把anyChecked设置为true

<form name="formreg" enctype="multipart/form-data" method="post">
    <input type="radio" value="male" name="gender" checked="checked"/>Male
    <br />
    <input type="radio" value="female" name="gender" />Female
    <br />
    <input value="Submit" onclick="return inputval()" type="submit" />
</form>
<div id="output"></div>

var output = document.getElementById("output");
var genderInputs = document.getElementsByName("gender");
var anyChecked = false;

for (var j = 0; j < genderInputs.length; j++) {
    if (genderInputs[j].checked === true) {
        anyChecked = true;
        break;
    }
}

output.textContent = "any checked: " + anyChecked;


男性


女性


var output=document.getElementById（“输出”）；
var genderInputs=document.getElementsByName（“性别”）；
var anyChecked=false；
对于（var j=0；j

查看javascript控制台，告诉我们错误消息PleaseIt没有显示任何错误。。。但也不起作用单选按钮中没有性别id。请参见第一个答案：为输入标签设置id，因为您正在为id选择名称，而这意味着什么也不选择。因此，没有错误。请。。详细说明：告诉OP他/她应该做什么。