1

我有以下 HTML 元素：

<input type="checkbox" id="dog_pop_123">
<input type="checkbox" id="cat_pop_123">
<input type="checkbox" id="parrot_pop_123">

我想检查一下，如果三个复选框都没有选中，我需要返回 false。但是，我需要考虑到第三个复选框可能不存在。

现在我有这个：

var id = 123;

if ( !$('#dog_pop_'+id+':checked').length
    && !$('#cat_pop_'+id+':checked').length
    && !$('#parrot_pop_'+id+':checked').length ) {
  return false;
}

但是，如果最后一个输入不存在，而前两个输入确实存在并被检查，这将返回 false，它不应该。

我该如何解决这个问题？

4

3 回答 3

2

我建议将复选框分组在一个共同的父项中：

<fieldset id="group1">
    <input type="checkbox" id="dog_pop_123">
    <input type="checkbox" id="cat_pop_123">
    <input type="checkbox" id="parrot_pop_123">
</fieldset>

并使用以下内容：

return !($('#group1 input:checkbox').length == $('#group1 input:checkbox:not(":checked")').length);

实际上，如果复选框的数量等于未选中的复选框的数量，则返回 false（使用!运算符），否则返回 true。

参考：

于 2012-11-21T20:29:33.630 回答
0

试试下面的代码：

var id = 123, 
    checkboxes = $('#dog_pop_' + id + ', #cat_pop_' + id + ', #parrot_pop_' + id);
if(checkboxes.filter(function() {return this.checked !== true;}).length !== checkboxes.length) {
    //Not all checkboxes are checked
}
于 2012-11-21T20:24:51.513 回答
0 
if($('input[id$="pop_123"]').length != $('input[id$="pop_123"]:checked').length ) {
  return false;
}

除非您有许多以 pop_123 结尾的 id，否则应该可以解决问题。在这种情况下，您也可以添加[type=checkbox]过滤器。

在选择器中使用$=以结束。查看文档

于 2012-11-21T20:29:19.133 回答