JavaScript实现CheckBox选中方法-js判断checkbox是否选中

JavaScript实现CheckBox选中所有的项的方法的文章很少见，这是笔者精心为大家准备的礼物，代码的借鉴性很高，也很好理解，希望能给大家带来帮助。

JavaScript实现CheckBox选中所有的项的方法：

<html> 
<head> 
<title> 
title> 
<body> 
<form name="Form1"> 
<input name="allbox" type="checkbox" onClick="TA();" title="选中或清除选中所有的项目" tabindex="105">选中或清除选中所有的项目  
<br/> 
<span class="X"> 
<input type="checkbox" name="ABC" class="A" onClick="TTA(this);">清明时节span> 
<br/> 
<span class="X"> 
<input type="checkbox" name="DEF" class="A" onClick="TTA(this);">长江水啊span> 
<br/> 
<span class="X"> 
<input type="checkbox" name="GHL" class="A" onClick="TTA(this);">嘿嘿测试span> 
<br/> 
form> 
<script language="javascript"> 
var frm = document.Form1;  
script> 
<script language="JavaScript"> 
function TA(isO,noHL){  
 var trk = 0;  
 for(var i=0;i<frm.elements.length;i++){  
  var e=frm.elements[i];  
  if((e.name !='allbox') && (e.type == 'checkbox')){  
    e.checked = frm.allbox.checked;  
   if (frm.allbox.checked){  
    //e.parentElement.className = "H"; //.parentElement不兼容firefox浏览器   
    e.parentNode.className = "H";//调用设置父节点元素class改变背景色  
   }else{  
    e.parentNode.className = "X";//调用设置父节点元素class改变背景色  
   }  
  }  
 }  
}  
function TTA(CB,noHL){  
 if (CB.checked){  
  CB.parentNode.className = "H";  
 }else{  
  CB.parentNode.className = "X";  
 }  
 var TB=TO=0;  
 for (var i=0;i<frm.elements.length;i++){  
  var e=frm.elements[i];  
  if ((e.name != 'allbox') && (e.type=='checkbox')){  
   TB++;  
  if (e.checked)  
   TO++;  
  }  
 }  
 frm.allbox.checked=(TO==TB)?true:false;  
 //如果不是所有项被选中则allbox设定未被选中  
}  
script> 
<style> 
.H{  
 background: #ADD8E6  
}  
.X{  
 background: #FFFFFF  
}  
style> 
body>html>

以上就是对JavaScript实现CheckBox选中所有的项方法的简单介绍。

【编辑推荐】