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：有（），我只需要選擇兒童

回答

相關問題