【问题标题】：jQuery radio button unchecked errorjQuery单选按钮未选中错误
【发布时间】：2014-08-13 22:43:00
【问题描述】：

我正在尝试使用 jQuery 进行表单验证，我发现了一些我无法理解的错误。

我有两个单选按钮

<input type="radio" name="gender" value="Male" id = "gender"/>Male
<input type="radio" name="gender" value="Female" id = "gender"/>Female

并验证这些是否被选中

if(! $('#gender').attr('checked')){
                alert('Please select your gender');
                return false;
            }

问题是当我检查第一个单选按钮并提交表单时，我没有收到警报，但是当我检查第二个单选按钮（女性）并提交表单时，我收到警报“请选择您的性别”。

【问题讨论】：

标签： jquery html

【解决方案1】：

首先，正如 j08691 在评论中提到的，没有两个 HTML 元素可以具有相同的 id 属性。其次，checked 用作属性，而不是属性。请改用$("#gender").prop("checked")；这将返回 true 或 false。

【讨论】：

【解决方案2】：

你可以用这个：

if(!$('[name="gender"]:checked').size())
     alert('Please select your gender');

【讨论】：

【解决方案3】：

JavaScript 的 ID 检测仅匹配 ID 的第一个实例，并且不会费心继续搜索，因为 id 属性旨在唯一。

要解决您的问题，首先删除那些重复的 ID 属性并更改您的 jQuery 选择器：

$('#gender')

收件人：

$('[name="gender"]')

然后您可以将它与 jQuery 的 :checked 选择器结合起来，以确定是否检查了 radio 元素之一：

if ( $('[name="gender"]:checked').length === 1 ) {
    alert('Please select your gender');
    return false;
}

【讨论】：

【解决方案4】：

试试这个

var isChecked = $('[name="gender"]:checked').length;

if(isChecked < 1) {
    alert("please Select your gender");
}

JSFiddile

【讨论】：