JQuery：取消选中ul li中的子子复选框

我有这样的代码：

 
 Child 1
 
 Child 2 
 
 
Sub Child 1
 
Sub Child 2
 
 
 
 Child 3
  

和jquery代码：

 $('input[@type=checkbox][level="child"]').click(function (event) { var checked = $(this).is(':checked'); if (checked) { alert("checked"); } else { //for click child to uncheck subchild alert("when unchecked"); $(this).closest('ul > li').children('input[@type=checkbox][level="subchild"]').attr('checked', false); } }); 

情况：检查子2 +子child1 +子child2

问题：当我点击取消选中子项2时，我想取消选中subchild1 + subchild2，上面的代码不起作用。 我认为它与以下内容有关：

 $(this).closest('ul > li').children('input[@type=checkbox [level="subchild"]').attr('checked', false); 

任何帮助都会很棒。 这是JSfiddle： http ： //jsfiddle.net/p324w/

Answer 1

 $('input[type=checkbox][level="child"]').click(function (event) { var checked = $(this).is(':checked'); if (checked) { console.log("checked"); } else { //for click child to uncheck subchild $(this).parent().find('input[type=checkbox][level="subchild"]').prop('checked', false); } }); 

jsFiddle示例

几点说明：

• 我不确定你为什么在你的类型选择器中使用@ ，但这是不必要的
• 你需要使用$(this).parent().find来导航到DOM中正确的输入元素
• 使用.prop('checked', false)代替.attr('checked', false) 。
• level不是有效属性。 如果您需要自定义属性，请使用data-* 。

Answer 2

工作FIDDLE演示

试试这个：

 $('input[type=checkbox][level="child"]').on('click', function () { // get checked status var checked = $(this).is(':checked'); // go up the dom to the parent of checkbox (li) $(this).closest('li') // find all subchild checkboxes .find('input[type=checkbox][level="subchild"]') // make them as the parent checkbox (checked or not) .prop('checked', checked); });