父子複選框選擇

Question

<input type="checkbox" name="all[]" id="<?php echo $record_id;?>" value="<?php echo $record_id; ?>" onclick="childChecked(this, this.form.elements['prnt'])"> 

上述代碼通過從數據庫中獲取數據

<input type="checkbox" name="all[]" id="<?php echo $record_id;?>" value="<?php echo $record_id; ?>" onclick="allChecked(this, this.form.elements['prnt'])"> 

創建用於每一行動態子複選框和以上是父複選框

JavaScript代碼：

function checkAll(){ 
     var main_check=document.getElementById("check"); 
     var all_check=document.getElementsByName('all[]'); 
     if(main_check.checked){ 
      for(var i=0;i<all_check.length;i++){ 
       all_check[i].checked=true; 
      } 
     }else{ 
      for(var i=0;i<all_check.length;i++){ 
       all_check[i].checked=false; 
      } 
     } 
    } 
function childChecked(child, prnt){ 
    if (!child.length){ // if not an array 
     prnt.checked = child.checked; 
     //alert(prnt.checked); 
     return; 
    } 
    for (var i=0; i<child.length; i++){ 
     if (!child[i].checked) 
    return; 
} 
prnt.checked = true; 
} 

上面的

是我父母孩子複選框選擇的代碼 它的作用是： 個1.檢查/檢驗上取消選中複選框兒童/取消選中複選框母公司2. 取消選中複選框家長，如果孩子複選框中的一個沒有被選中

，現在我的問題是，它會檢查父複選框，如果我們選中一個孩子，但複選框我想檢查父複選框，當且僅當所有子複選框被選中

Answer 1

你的代碼可以簡化爲：

var main_check = document.getElementById("check"); 
var all_check = document.getElementsByName('all[]'); 

main_check.onchange = checkAll; 

for (var i = 0; i < all_check.length; i++) { 
    all_check[i].onchange = childChanged; 
} 

function checkAll() { 
    for (var i = 0; i < all_check.length; i++) { 
     all_check[i].checked = main_check.checked; 
    } 
} 

function childChanged() { 
    if (!this.checked) { 
     main_check.checked = false; 
     return; 
    } 

    // Check if main checkbox should be checked 
    for (var i = 0; i < all_check.length; i++) { 
     if (!all_check[i].checked) return; 
    } 

    main_check.checked = true; 
} 

和HTML：

<input type="checkbox" id="check" /> Main 

<ul> 
    <li><input type="checkbox" name="all[]" /></li> 
    <li><input type="checkbox" name="all[]" /></li> 
    <li><input type="checkbox" name="all[]" /></li> 
    <li><input type="checkbox" name="all[]" /></li> 
</ul> 

我也擺脫了內聯事件處理程序。

演示：http://jsfiddle.net/TXRNF/