有关使用jquery动态生成复选框的父/子关系的问题
问题描述:
我有一种复选框,基于用户内容动态生成。复选框的部分按类别划分,每个类别都有内部的项目。出于数据库目的,类别值具有隐藏的复选框。如果一个类别包含复选框被选中的子项目,那么类别复选框也会被选中。有关使用jquery动态生成复选框的父/子关系的问题
我已经得到了这个工作正常使用JQuery .click(),但我无法弄清楚如何在页面加载时做到这一点。
这是我当复选框被实际点击下面的代码:
$(".project").click(function() {
if($(this).is(":checked") && $(this).hasClass("project")) {
$(this).parent().parent().children(':first').attr('checked', true);
}else if(!$(this).parent().children('.project').is(":checked")){
$(this).parent().parent().children(':first').attr('checked', false);
}
});
现在,当我在编辑这些箱子的状态(这意味着之后他们一直保存到数据库)类别框不显示即使他们的子项目已被检查,但仍被检查。我能做些什么来做到这一点,这样我的分类框将在加载时被检查,如果该分类的孩子被检查?
问题的一部分我认为是动态变化的父子设置,我如何找到父框以便检查它?谢谢!
答
编辑:
比方说,父元素具有独特的类。
<div class="parent">
<input type="checkbox" />
<div>
<input type="checkbox" class="project" checked="checked" />
</div>
<div>
<input type="checkbox" class="project" />
</div>
</div>
你可以做这样的事情在页面加载:
$('.parent:has(.project:checked)').children(':first').attr('checked','checked');
这将返回有一个具有project
类和检查至少一个后代.parent
元素。
文档为:有选择http://api.jquery.com/has-selector/
如果你想运行click
处理程序加载网页时,可以手动触发它。
$(".project").click(function() {
if($(this).is(":checked") && $(this).hasClass("project")) {
$(this).parent().parent().children(':first').attr('checked', true);
}else if(!$(this).parent().children('.project').is(":checked")){
$(this).parent().parent().children(':first').attr('checked', false);
}
});
$('.project').click(); // Triggers the click event handler
这是简写:
$('.project').trigger('click'); // Accomplishes the same as above
哇你复制我的答案o.O – jantimon 2010-06-01 16:36:12
@Ghommey-认真?如果是这样,不要。 – user113716 2010-06-01 16:38:03
是的,你做到了。刚刚阅读我的代码说'.click()'..你发布你的答案2分钟后给出相同的解决方案.. – jantimon 2010-06-01 16:39:41