Question

我有一个包含多个（＆gt; 10个）订阅容器的表单，每个容器包含一个或两个复选框。例如。订阅1（div容器）包含两个选项（复选框），如果未选中其他订阅容器下的其他复选框，或者选中的复选框不超过一个，则可以检查这些选项。

<div class="subscription1">
    <input type="checkbox" name="a"></input>
    <input type="checkbox" name="b"></input>
</div>
<div class="subscription2">
    <input type="checkbox" name="a"></input>
    <input type="checkbox" name="b"></input>
</div>

已选中复选框的总限制为4，最多为2个两个父容器。（2x2 = 4）

如果父容器的兄弟姐妹已选中复选框，则应首先检查复选框更改。如果他们已经禁用或隐藏了父容器的兄弟姐妹，他们没有选中复选框（换句话说，只显示当前选择）。

反之亦然，当更改复选框状态时，如果已选中复选框的父级兄弟的数量为1或更少，则应显示具有未选中复选框的父容器。

Jquery选择器（乍一看）可能是这样的：

$allotherparents = $(this).parent('.parent').siblings()

$notchecked = $allotherparents.filter('input:not(:checked)')

$checked = $allotherparents.filter('input:checked')

然后简要计算长度，评估并做出改变。但是，我不相信这些选择器，因为只有第一个返回长度＆gt; 0

Answer 1

我认为你需要这样的事情 - http://jsfiddle.net/ug3crxcy/

$allotherparents = $(this).parent('.parent').siblings('.parent');

$notchecked = $allotherparents.filter(function(){
    return $(this).find('input:checked').length === 0;
});

$checked = $allotherparents.filter(function(){
    return $(this).find('input:checked').length > 0;
});

在最多两个父容器下允许最多4个选中复选框

1 个答案: