5

我有一个问题,我一直在寻找答案一段时间,但无法让它发挥作用。

我正在寻找一种方法来检查是否选中了一组复选框中的至少一个复选框。对我来说如此困难的是,这些输入中的每一个都有不同的名称值。我只找到了 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]"。我想你明白我的意思,希望如此。

任何帮助将非常感激。

编辑:

增加了一个表单中可能有多个复选框的描述

4

1 回答 1

11

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

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

请参阅官方 jQuery API 页面上的第一个示例以获取 :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...]
    }
});
于 2013-02-03T03:11:10.857 回答