jQuery 中的动态单选按钮组验证

验证以确保检查每组中至少一个的最佳方法是什么，因此在以下示例中，组是name1, name2, name3?

Example

<input type="radio" name="name1">
<input type="radio" name="name1"> 
<input type="radio" name="name1"> 

<input type="radio" name="name2"> 
<input type="radio" name="name2"> 
<input type="radio" name="name2">

<input type="radio" name="name3"> 
<input type="radio" name="name3"> 
<input type="radio" name="name3">

我知道我可以在每个 div 周围包裹一个 div，然后检查 div 中的每个单选按钮，但我正在寻找一种更动态的解决方案。因此，如果将来添加更多单选按钮，则不需要更改 jQuery 代码或不需要添加 div - 我希望这是有意义的。

你应该使用jquery.validate.js http://jquery.bassistance.de/validate/jquery.validate.js图书馆可以帮助您解决这个问题，请查看他们的demo http://jquery.bassistance.de/validate/demo/radio-checkbox-select-demo.html

如果您使用该库，那就很简单，

<input type="radio" name="name1" validate="required:true">
<input type="radio" name="name1">
<input type="radio" name="name1">

<input type="radio" name="name2" validate="required:true">
<input type="radio" name="name2">
<input type="radio" name="name2">

查看jFiddle http://jsfiddle.net/apdR2/：这会找到单选按钮的所有不同名称，然后遍历所有这些不同的组并确保至少检查了一个，如果没有，则会发出警报。

$('#button').click(function() {
    var names = [];

    $('input[type="radio"]').each(function() {
        // Creates an array with the names of all the different checkbox group.
        names[$(this).attr('name')] = true;
    });

    // Goes through all the names and make sure there's at least one checked.
    for (name in names) {
        var radio_buttons = $("input[name='" + name + "']");
        if (radio_buttons.filter(':checked').length == 0) {
            alert('none checked in ' + name);
        } 
        else {
            // If you need to use the result you can do so without
            // another (costly) jQuery selector call:
            var val = radio_buttons.val();
        }
    }
});