使用happy.js验证多个复选框

Question

我正在使用happy.js来验证表单。我需要验证用户是否至少单击了多个复选框中的一个。此语法特定于HAPPY.JS。

我尝试用下面的代码做的是针对特定div中的所有复选框，如果至少选中了其中的一个，表单就会进行验证。如果没有选中，表单将抛出错误。

感谢任何人的帮助。

在happy.js方法中，我的自定义函数是：

   multiOption: function () {
    return $('#check_section > .checkbox').is(':checked').length >= 1;

    }

在前端：

<div id="check_section">
   <input type="checkbox"  class="checkbox"/>
   <input  type="checkbox" class="checkbox"/>
   <input  type="checkbox" class="checkbox"/>
</div>

代码似乎无法定位复选框。做了这个快速的小提琴：http://jsfiddle.net/9fnC8/1/

Answer 1

试一试

:checked Selector

return $('#check_section > .checkbox:checked').length;

$('#check_section > .checkbox:checked').length将给出选中的复选框的长度。

如果长度为0，则返回false；如果大于0，则返回true

Answer 2

尝试将"is“函数更改为"filter"：

 return $('#check_section > .checkbox').filter(':checked').length >= 1;

正如jQuery文档所述，如果其中一个元素与选择器匹配，则"is“函数将返回true。

根据选择器、元素或jQuery对象检查当前匹配的元素集，如果这些元素中至少有一个与给定参数匹配，则返回true。

您甚至可以删除：.length >= 1并只返回"is“调用的结果，因为如果选中了一个或多个复选框，则返回true，如果没有选中，则返回false。

编辑：

在看到jsFiddle中提供的标记后，问题是由于选择器中的>造成的，>表示仅选择子元素。

由于您的复选框不直接位于#check_section元素内，但实际上包含在此元素内的跨度内(使它们成为孙子元素，而不是#check_section元素的子元素)，因此结果中不包括您想要的复选框。

将您的代码更改为以下代码，它应该可以工作：

return $('#check_section .checkbox').filter(':checked').length >= 1;

或

return $('#check_section .checkbox').is(':checked');

http://jsfiddle.net/g7FJw/2/

Answer 3

它是>选择器。它选择作为父级的直接子级的元素，.checkbox元素不是#check_section的直接子级(它们是子级的)(在这里是这样的，但在您的提琴中它们不是)。jQuery .is()返回一个布尔值(true或false)，所以对布尔值执行length没有任何意义。简单地做

multiOption: function () {
    return $('#check_section .checkbox').is(':checked');

    }

应该是你想要的。根据fiddle here