2

我有一个注册表单，想在性别部分单选按钮上添加验证。我的表格就像

<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>

找不到问题。

4

6 回答 6

2

您通过 Id 获取元素，“gender”是您输入的名称，而不是 id。
代替

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

你应该使用

<input type="radio" value="male" id="gender" /> Male<br />
于 2013-03-22T17:58:31.670 回答
1

由于您使用 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>
于 2013-03-22T18:00:10.740 回答
0

你放下 jQuery，所以我会使用它。 document.getElementById('checked')不存在。即使是这样，它也只适用于一个元素。您必须遍历每个[name=gender]元素以查看是否检查了任何元素。jQuery 使这变得微不足道：

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

http://jsfiddle.net/ExplosionPIlls/s2YfU/

编辑：非 jQuery 解决方案也很简单，因为querySelectorAll('[name=gender]:checked')也可以。

于 2013-03-22T18:00:28.823 回答
0

无需验证。默认选中一个单选按钮

<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>
于 2013-03-22T18:02:06.880 回答
0

试试这个:checked：

<script type="text/javascript">
 function inputval(){
    if($(':checked').length < 0)
    {
        alert("Select at least male or female.");
        return false;
    }   
}
</script>
于 2013-03-22T17:59:05.217 回答
0

这个小提琴可以给你一些想法（没有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;

http://jsfiddle.net/F8XGU/1/

于 2013-03-22T18:37:00.490 回答