1

我正在尝试通过复选框本身取消选中该分组列表中所有选中的复选框或单选按钮。

为了更好地理解这个小提琴:http: //jsfiddle.net/XWQcZ/47/

“重置”复选框在选中后立即取消选中所有子项,反之亦然。

问题可能出在这一行,因为它没有得到合适的孩子:

 var group = $checkbox.parents('option-set').attr('data-group');

我让它在第一个不在列表中的复选框上工作。但是,只要我将复选框放入列表中;

<ul><li></li></ul>

重置按钮不再起作用..不知道为什么。因此,单选按钮尚未正常工作。

它必须很容易,但是如何正确地完成这项工作呢?提前致谢。

编辑

换了小提琴。添加了过滤的值以获得更好的概览。但是,单选按钮还不能正常工作,因为它保留了未选中的值。

4

2 回答 2

2

首先,“选项集”是一个类,所以它必须被称为一个类。只需在开头放一个点,例如:

var group = $checkbox.parents('.option-set').attr('data-group');

但主要问题在于这一行:

$checkbox.siblings( selector ).removeAttr('checked');

当您将复选框放在 ul li 标签之间时,复选框的兄弟姐妹会发生变化。所以这条线应该是:

$(".option-set[data-group='"+group+"'] "+selector).not($checkbox).removeAttr('checked');

“not($checkbox)”过滤器从列表中排除当前项目本身。我认为这足以让您的代码正常工作。

于 2013-10-10T14:05:38.790 回答
0

给每个列表一个唯一的 id,但也给他们所有相同的类

<ul id="group1" class="resettable">
    <li><input type="checkbox" ... ></li>
...
</ul>

<ul id="group2" class="resetable">
    <li><input type="checkbox" ... </li>
</ul>

给你的“所有”复选框一个唯一的ID:

<input type="checkbox" id="reset" ...>    
<input type="checkbox" id="brand1" ...>

在您的 jQuery 中,您需要将一个处理程序添加到“所有”复选框的单击事件中。

$('#reset').click(function(){
    // will uncheck all checkboxes in a <ul class="resetable">
    $('.resetable').children().prop('checked', false);

});



$('#brand1').click(function(){
//will select all check boxes in your <ul id="group1">
    $('#group1').children(':checkbox').prop('checked', true);

});
于 2013-10-10T13:48:36.757 回答