javascript - 单选按钮组的 jQuery 迭代验证

Question

我的表单上有几个单选按钮控件。

<input type="radio" name="Gender" value="M">Male
<input type="radio" name="Gender" value="F">Female

<input type="radio" name="Vehicle" value="H">Honda
<input type="radio" name="Vehicle" value="T">Toyota
<input type="radio" name="Vehicle" value="L">Lexus
<input type="radio" name="Vehicle" value="M">Mercedes
<input type="radio" name="Vehicle" value="V">VW

<input type="radio" name="Device" value="D">Desktop
<input type="radio" name="Device" value="L">Laptop
<input type="radio" name="Device" value="S">SmartPhone
<input type="radio" name="Device" value="T">Tablet

<input type="button" onclick="javascript:ButtonClick();" name="Next">

现在我希望当调用 ButtonClick() 时，它应该验证每个组中至少有一个单选按钮被调用。

我想要的是一个 jQuery 函数，它将循环遍历所有单选按钮控件并按每个组验证它们。

$("<CORRECT SELECTOR>").each(function() {
    // Validate this radio button group
});

如果已经有人问过这个问题，请指出我。感谢您的所有帮助。

Answer 1

也许是这样的:

SEE jsFiddle

function ButtonClick() {
    var valid = true;
    var grps = $.unique($('input[type=radio]').map(function () {
        return this.name
    }).get());
    $.each(grps, function (_, grp) {
        if (!$('input[type=radio]').filter('[name="' + grp + '"]').is(':checked')) {
            alert('No radio ' + grp + ' is checked!'); 
            valid = false;
            return;
        }
    });    

    if(valid) alert('At least one radio of each group checked!');
}