Question

如何使用JQuery验证Checkbox组？我需要确保在每个组中至少选中一个复选框。我想使用一个类来识别组，因此，html看起来像这样：

<!-- checkbox group -->
<fieldset class="CbxGroup">
  <legend>Checkbox Group (required)</legend>
  <label><input type="checkbox" name="cbxGroup1[]" value="one" id="cbxGroup1_0">One </label>
  <br>
  <label><input type="checkbox" name="cbxGroup1[]" value="two" id="cbxGroup1_1">Two </label>
  <br>
  <label><input type="checkbox" name="cbxGroup1[]" value="three" id="cbxGroup1_2">Three</label>
  <br>
  <label><input type="checkbox" name="cbxGroup1[]" value="four" id="cbxGroup1_3">Four </label>
  <br>
  <label><input type="checkbox" name="cbxGroup1[]" value="five" id="cbxGroup1_4">Five </label>
  <br>
</fieldset>

因为复选框没有像选择列表/菜单那样的包装元素，所以我不知道如何将其关闭。对于单个复选框，我可以执行以下操作，但它不适用于复选框组：

谢谢！

$('.CbxSingle').each(function() {
        var CbxCheck = $(this);
        if(!CbxCheck.is(':checked')) {
            // do something
        }
        else{
            // do something else
        }
    });

我希望以下内容能够分别验证每个组：

$('.CbxGroup').each(function() {
        if ($('input[type=checkbox]:checked').length == 0) {
            alert('not selected!');
        }
        else{
            alert('selected!');
        }
    });

Answer 1

也许这样的事情可能有用：

if($(".CbxSingle input[type=checkbox]:checked").length != 0){
    // Run success code
}else{
    // Run failure code
}

jQuery文档网站上有一个非常类似的参考：checked选择器：http://api.jquery.com/checked-selector/

希望有所帮助！

Answer 2

这可能适用于您所描述的内容：

var numberChecked=$("input[name='cbxGroup1[]']:checked").length;
if(numberChecked<1)
    alert('none checked');
else
    alert(numberChecked+' checked);

Answer 3

我创建了一个轻微的variation as a fiddle，它似乎工作正常。我认为您的问题是.CbxSingle类未应用于input，因此您可能会使用其他选择器，例如.CbxGroup input[type=checkbox]。

JQuery多个复选框组验证

3 个答案: