復(fù)選框組選JS代碼怎么寫

2012/11/1 11:18:05作者：佚名來源：網(wǎng)絡(luò)

移動(dòng)端

【實(shí)例名稱】

復(fù)選框組選JS代碼怎么寫

【實(shí)例描述】

復(fù)選框的功能是用來多選，當(dāng)復(fù)選框有多組數(shù)據(jù)時(shí)，如何實(shí)現(xiàn)同時(shí)選中某一組數(shù)據(jù)呢?本例學(xué)習(xí)這種效果的制作過程和原理。

【實(shí)例代碼】

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>標(biāo)題頁(yè)-學(xué)無憂（m.wangbatian.cn）</title>
<script language=javascript>
function sts()
{
}
</script>
</head>
<body>
<script language="JavaScript">
function selectGroup(obj)
{
  var chkObj = obj.id;              
//獲取對(duì)象的id
  var chkValue=obj.checked;                
//判斷當(dāng)前對(duì)象是否選中
  var chkArr = mySpan.getElementsByTagName("input");
//獲取所有的復(fù)選框
  for(var i=0; i<chkArr.length; i++)         
//遍歷所有的復(fù)選框
    if(chkArr[i].id==chkObj)                   
//判斷ID是否相等
      chkArr[i].checked=chkValue                      
//如果相等則選中
}
</script>
<span id="mySpan">
<input type="checkbox" onclick="selectGroup(this)" 
name="ID[]" id="A001" value="1">A001
<input type="checkbox" onclick="selectGroup(this)" 
name="ID[]" id="B001" value="3">>B001
<input type="checkbox" onclick="selectGroup(this)" 
name="ID[]" id="A001" value="444">>A001<br />
<input type="checkbox" onclick="selectGroup(this)" 
name="ID[]" id="B001" value="23">>B001
<input type="checkbox" onclick="selectGroup(this)" 
name="ID[]" id="B001" value="11">>B001
<input type="checkbox" onclick="selectGroup(this)" 
name="ID[]" id="C001" value="15">>C001<br />
<input type="checkbox" onclick="selectGroup(this)" 
name="ID[]" id="C001" value="17">>C001
<input type="checkbox" onclick="selectGroup(this)" 
name="ID[]" id="C001" value="10">>C001
<input type="checkbox" onclick="selectGroup(this)" 
name="ID[]" id="C001" value="121">>C001
</span>
</body>
</html>

【運(yùn)行效果】

運(yùn)行效果