JavaScript實現CheckBox選中方法

作者：佚名 2009-09-08 13:52:54

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選中所有的項方法的簡單介紹。

【編輯推薦】

JSON是什么？為JavaScript準備的數據格式
十個最常用的JavaScript自定義函數
有關JavaScript事件加載的一些延伸思考
JavaScript使用心得匯總：從BOM和DOM談起
ExtJS在Android模擬器上的運行效果

責任編輯：阡陌來源：網絡轉載

CheckBox選中

成人免费xxxxx在线视频软件_久久精品久久久_亚洲国产精品久久久_天天色天天色_亚洲人成一区_欧美一级欧美三级在线观看

JavaScript實現CheckBox選中方法