JQuery:取消选中ul li中的子邮箱复选框 [英] JQuery: uncheck subchild checkbox inside ul li
本文介绍了JQuery:取消选中ul li中的子邮箱复选框的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我有这样的代码:
<ul>
<li><input type="checkbox" level="child" name="somename1" value="1" /> Child 1</li>
<li><input type="checkbox" level="child" name="somename2" value="2" /> Child 2 <br />
<ul>
<li><input type="checkbox" level="subchild" name="somename1" value="3" />Sub Child 1</li>
<li><input type="checkbox" level="subchild" name="somename2" value="3" />Sub Child 2</li>
</ul>
</li>
<li ><input type="checkbox" level="child" name="somename3" value="3" /> Child 3</li>
</ul>
和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 +子级1 +子级2
Situation: child 2 + subchild1 + subchild2 is checked
问题:我想取消选中subchild1 + subchild2当我点击取消选中子2,上面的代码不工作。我认为它与以下有关:
Problem: i want to uncheck the subchild1 + subchild2 when i clicked uncheck of child 2, my code above does not work. i think it has something to do with:
$(this).closest('ul > li').children('input[@type=checkbox [level="subchild"]').attr('checked', false);
任何帮助将是巨大的。这里是JSfiddle: http://jsfiddle.net/p324w/
any help would be great. Here is JSfiddle: http://jsfiddle.net/p324w/
推荐答案
$('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 example
一些注意事项:
- 我不确定为什么您在类型选择器中使用
@
,但这是不必要的 - 您需要使用
$(this).parent()。find
导航到DOM中的正确输入元素 - code> .prop('checked',false)而不是
.attr('checked',false)
-
level
不是有效的属性。如果您需要自定义属性,请使用data - *
。
- I'm not sure why you were using
@
in your type selector but it's unnecessary - You need to use
$(this).parent().find
to navigate to the proper input elements in the DOM - Use
.prop('checked', false)
instead of.attr('checked', false)
. level
isn't a valid attribute. If you need custom attributes, usedata-*
.
这篇关于JQuery:取消选中ul li中的子邮箱复选框的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文