JQuery：有（），我只需要选择儿童

我有我用JQuery操作的一些分层数据，我试图添加一些类型的视觉指示，说明我的树中哪些元素被选中。这里是我生成HTML的样本（我们正在操纵）：JQuery：有（），我只需要选择儿童

<li> 
    <input class="selectedcheck" checked disabled type="checkbox" name="ign-130"> 
    <input class="millermultiselect" type="checkbox" name="chk-130"> 
    <a href="#" data-parent="6" data-nodename="Egypt" data-self="130">Egypt</a> 
    <ul> 
      <li> 
       <input class="selectedcheck" checked disabled type="checkbox" name="ign-131"> 
       <input class="millermultiselect" type="checkbox" name="chk-131"> 
       <a href="#" data-parent="130" data-nodename="Cairo" data-self="131">Cairo</a> 
      </li> 
    </ul> 
</li>

所有这一切都位于一个div＃米勒之内。第一个复选框（.selectedcheck）仅用于显示选择了一个区域（它开始隐藏，并且在选择父区域时显示，所以如果您在埃及点击.millermultiselect，开罗的.selectedcheck将成为可见，取代开罗的.millermultiselect）。我想要做的也是添加一个类到任何包含（作为一个直接孩子）复选框的李。我试图用下面的jQuery代码来实现：

$("#miller li:has(input:checkbox:checked:visible)").addClass('chosen');

是我遇到的问题是，由于所有的区域都是由嵌套UL的的，检查的任何区域中的复选框，还增加了.chosen到树中的任何一个更高...因此单击开罗的复选框会将.chosen类添加到埃及和非洲。

任何人都有一个想法，我将如何去捕获李的有一个可见的复选框作为一个直接的孩子？

这里是我的整个js文件，以防万一它提供了深入了解：

$(document).ready(function() { 
    $(".selectedcheck").hide(); 
    showSelected = function(){ 
     $("#miller li").removeClass("chosen"); 
     $("#miller li:has(input:checkbox:checked:visible)").addClass('chosen'); 
    }; 
    $("#miller a").click(function(event) { 
     event.preventDefault(); 
     $("#miller li").removeClass("selected"); 
     $(this).parent().addClass("selected"); 
     data = $(this).data(); 
     $("#addChild").attr("href", "addChild.php?parentid=" + data.self).html("Add item under " + data.nodename); 
     $("#addSibling").attr("href", "addChild.php?parentid=" + data.parent).html("Add item next to " + data.nodename); 
     $("#editRegion").attr("href", "editRegion.php?id=" + data.self).html("Edit " + data.nodename); 
     $("#deleteRegion").attr("href", "deleteRegion.php?id=" + data.self).html("Delete " + data.nodename); 
     $("#addResort").attr("href", "addResort.php?regionid=" + data.self).html("Add resort to " + data.nodename); 
     $("#miller ul ul").hide(); 
     $(this).parents("#miller ul").show(); 
     $(this).siblings("#miller ul").show(); 
     showSelected(); 
    }); 
    $("#miller .millermultiselect").click(function(event) { 
     $("#miller li").removeClass("selected"); 
     $(this).parent().addClass("selected"); 
     $("#miller ul ul").hide(); 
     $(this).parents("#miller ul").show(); 
     if($(this).is(':checked')) { 
      $(this).parent().find(".millermultiselect").not(this).hide(); 
      $(this).parent().find(".millermultiselect").not(this).removeAttr("checked"); 
      $(this).parent().find(".selectedcheck").show(); 
     } else { 
      $(this).parent().find(".millermultiselect").not(this).show(); 
      $(this).parent().find(".selectedcheck").hide(); 
     } 
     $(this).siblings(".selectedcheck").hide(); 
     $(this).siblings("#miller ul").show(); 
     showSelected(); 
    }); 
});

来源

2012-04-11 Brendon Dugan

可以使用嫡系选择，然后获取它的父：

$("#miller li > input:checkbox:checked:visible").parent().addClass("chosen");

来源

2012-04-11 16:00:16 jfriend00

这正是我所期待的。我很确定我的大脑今天没有工作。 – 2012-04-11 16:04:07

我怎么会去关于只捕获具有可见的复选框作为直接孩子的李？

如何解决问题？

$('input:checkbox').is(':visible').is(':checked').parent('li')

来源

2012-04-11 16:03:49 Alnitak

JQuery：有（），我只需要选择儿童

回答

相关问题