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并返回“是”调用的结果，如果已选中一个或多个复选框，则为true;如果没有选中，则为false。< / p>

修改

在看到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');

    }

应该是你的追求。根据小提琴here

Answer 4

我想我明白了。我没有正确地识别这些复选框。请注意，如果您在div中搜寻儿童，则必须包括完整路径，包括可能阻碍的任何跨度标记。

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

4 个答案: