jquery - 如何检查一组具有不同名称值的复选框中是否至少选中了一个复选框

Question

我有一个问题，我一直在寻找答案，但现在无法解决。

我正在寻找一种方法来检查一组复选框中是否至少有一个复选框被选中。对我来说如此困难的是这些输入中的每一个都有不同的名称值。我只找到了 jQuery 验证插件等的答案。这是我的 html:

<tr class="formField-checkbox formFieldRequired">
  <td class="formLabelHolder"><label for="field129">Group of checkboxes</label></td>
  <td class="formFieldHolder">
    <input type="checkbox" name="field129[0]" class="formCheckbox required" value="Something1"> 
    <label><span class="formCheckboxLabel">Something1</span></label>
    <input type="checkbox" name="field129[1]" class="formCheckbox required" value="Something2"> 
    <label><span class="formCheckboxLabel">Something2</span></label>
    <input type="checkbox" name="field129[2]" class="formCheckbox required" value="Something3"> 
    <label><span class="formCheckboxLabel">Something3</span></label>
  </td>
</tr>

这是我现在拥有的 jQuery:

// Validate all checkboxes
var named = [];
var $requiredCheck = $(this).find('input[type="checkbox"].required');

$($requiredCheck,$formId).each(function() {
  // Creates an array with the names of all the different checkbox group.
  named[$(this).attr('name')] = true;
});

// Goes through all the names and make sure there's at least one checked.
for (name in named) {
  var $checkboxes = $("input[name='" + name + "']");
  if ($checkboxes.filter(':checked').length == 0) {
    $checkboxes.closest('.formFieldHolder').addClass('error').append('<span   class="error">Required!</span>');
  } 
}

目前这显然不能完美地工作，因为复选框具有不同的名称值。现在追加打印出与复选框一样多的错误消息。例如，如果有五个复选框并且选中了一个，它仍然会给出四次错误消息。长期以来，我一直试图自己解决这个问题，但就是做不好。我不能更改这些复选框的名称值，也不能简单地对 html 做任何事情。我认为可以做到这一点的一种方法是删除名称中最后的 [0]、[1] 和 [2] 部分，但我没有找到让它起作用的方法。

我认为简单的 jQuery 验证方法会失败，因为在一个表单中可能有更多的复选框组。下一组复选框的名称值为 name="field130[0]"、name="field130[1]"和 name="field130[2]"。希望您明白我的意思。

如有任何帮助，我们将不胜感激。

编辑:

增加了一个表单中可以有多个复选框的说明

Answer 1

你让这种方式太复杂了:)

if ($('.required:checked').length > 0) {  // the "> 0" part is unnecessary, actually
    [do something]
}

请参阅 the official jQuery API page for :checked 上的第一个示例.

回应您的评论

如果页面上有多个表单，可以将表单指定为容器:

if ($('#form1_id').find('.required:checked').length) {...

测试多个表单

给每个表单 testable_form 类。

$('.testable_form').each(function() {
    if ($(this).find('.required:checked').length) {
        [do something - set a flag, add a class...]
    }
});