<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);">清明時節(jié)</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";//調用設置父節(jié)點元素class改變背景色
???
???}else{
????e.parentNode.className = "X";//調用設置父節(jié)點元素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>