JavaScript實(shí)現(xiàn)CheckBox選中方法
作者：佚名
JavaScript實(shí)現(xiàn)CheckBox選中所有的項(xiàng)的方法的文章很少見，這是筆者精心為大家準(zhǔn)備的禮物，代碼的借鑒性很高，也很好理解，希望能給大家?guī)?lái)幫助。
JavaScript實(shí)現(xiàn)CheckBox選中所有的項(xiàng)的方法的文章很少見，這是筆者精心為大家準(zhǔn)備的禮物，代碼的借鑒性很高，也很好理解，希望能給大家?guī)?lái)幫助。
JavaScript實(shí)現(xiàn)CheckBox選中所有的項(xiàng)的方法：
- <html>
- <head>
- <title>
- title>
- <body>
- <form name="Form1">
- <input name="allbox" type="checkbox" onClick="TA();" title="選中或清除選中所有的項(xiàng)目" tabindex="105">選中或清除選中所有的項(xiàng)目
- <br/>
- <span class="X">
- <input type="checkbox" name="ABC" class="A" onClick="TTA(this);">清明時(shí)節(jié)span>
- <br/>
- <span class="X">
- <input type="checkbox" name="DEF" class="A" onClick="TTA(this);">長(zhǎng)江水啊span>
- <br/>
- <span class="X">
- <input type="checkbox" name="GHL" class="A" onClick="TTA(this);">嘿嘿測(cè)試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";//調(diào)用設(shè)置父節(jié)點(diǎn)元素class改變背景色
- }else{
- e.parentNode.className = "X";//調(diào)用設(shè)置父節(jié)點(diǎn)元素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;
- //如果不是所有項(xiàng)被選中則allbox設(shè)定未被選中
- }
- script>
- <style>
- .H{
- background: #ADD8E6
- }
- .X{
- background: #FFFFFF
- }
- style>
- body>html>
以上就是對(duì)JavaScript實(shí)現(xiàn)CheckBox選中所有的項(xiàng)方法的簡(jiǎn)單介紹。
【編輯推薦】
責(zé)任編輯：阡陌
來(lái)源：
網(wǎng)絡(luò)轉(zhuǎn)載
