jquery複選框（如果其他人選中，請選中/取消選中）

Question

希望有人能幫助解決這個問題。

我有一個複選框的廣泛列表，我需要一個更智能（自動）的頁面。

頁面上的所有複選框共享相同的'name'屬性，但它們具有子分組。

我正在尋找延長這一點，所以當任何複選框在一個組中檢查'，'父'被檢查，如果沒有任何分組（在<ul></ul>內），那麼父母是未選中。

我在這裏已經設置一個的jsfiddle：http://jsfiddle.net/swdmedia/xsDgm/13/

的jQuery attr()和data()

$('input.checkbox').click(function() { 
    var parent = $(this).attr('data-parent'); 

    $('#'+parent).attr('checked', true); 
}); 

HTML

<h4>Agriculture <input type="checkbox" id="cat4" name="cntnt01cd_categories[]" value="4" /></h4> 

<ul> 
    <li> 
    <label for="cat44" class="checkbox"> 
    <input type="checkbox" class="checkbox" id="cat44" name="cntnt01cd_categories[]" value="44" data-parent="cat4" />Farm Services</label> 
</li> 
    <li> 
    <label for="cat40" class="checkbox"> 
    <input type="checkbox" class="checkbox" id="cat40" name="cntnt01cd_categories[]" value="40" data-parent="cat4" />Farming</label> 
</li> 
</ul> 

<h4>Automotive Sales and Supplies <input type="checkbox" id="cat5" name="cntnt01cd_categories[]" value="5" /></h4> 

<ul> 

    <li><label for="cat46" class="checkbox"><input type="checkbox" id="cat46" name="cntnt01cd_categories[]" value="46"/> Auto Service or Auto Repair</label></li> 

    <li><label for="cat48" class="checkbox"><input type="checkbox" id="cat48" name="cntnt01cd_categories[]" value="48"/> Auto Glass</label></li>           
</ul> 

Answer 1

使用prop()轉而使用HTML5數據attribite

$('input.checkbox').click(function() { 
    var parent = $(this).data('parent'); 

    $('#'+parent).prop('checked', true); 
}); 

更新（我猜你會太需要這個）

更新版本：如果有一組內部的複選框被選中父檢查別的選中。

$('input.checkbox').click(function() { 
    var parent = $(this).data('parent'); 
    var checked =false; 
    $(this).parents('ul').find(':checkbox').each(function(){ 
    if(this.checked){ 
     checked = true; 
     return; 
    } 
    }); 
$('#'+parent).prop('checked', checked); 
}); 

我想你的第二組在小提琴不起作用，因爲你沒有說明這個組的輸入類和數據屬性。是的，你可以選擇所有輸入複選框$(':checkbox')而不是給所有的輸入複選框元素和調用類選擇器（少代碼）的類。

fiddle