checkbox分级操作(不同名)
checkbox分级操作(不同名) <title>CheckBox</title>
<script language=javascript defer>
var n=document.getElementsByTagName('INPUT');
var CheckBoxNum=n.length;
var SubNodeCheckSome,SameNodeCheckSome,tf,SearchNodeName,SearchParentNodeName,SameNodeNum,SubNodeCheckedNum,SameNodeCheckedNum,SubNodeNum,SubNodeCheckedTF;
function FindParentNode(SubNodeName) //获取上级结点名,并判断是否被选中
{
tf=false; //初始化选中状态
SearchNodeName=SubNodeName;
t=SubNodeName.lastIndexOf('_'); //判断是否存在上级结点
if(t!=-1)SearchNodeName=SubNodeName.substring(0,t); //如果存在上级结点,取得上级结点名
if(document.all(SubNodeName).checked)tf=true; //判断结点是否被选中
return SearchNodeName;
}
function CheckSubNode(NodeName) //获取结点名,并判断子结点是否选中
{
SubNodeCheckedTF=false; //初始化子结点选中状态
SubNodeNum=0; //初始化子结点数目
SameNodeNum=0; //初始化同级结点数目
SubNodeCheckedNum=0; //初始化子结点被选中的数目
SameNodeCheckedNum=0; //初始化同级结点被选中的数目
SubNodeCheckSome=0; //初始化子结点半选数目
SameNodeCheckSome=0; //初始化同级结点半选数目
ParentNodeName=FindParentNode(NodeName); //取得上级结点名
SearchParentNodeName=NodeName; //当前结点名
d=NodeName.lastIndexOf('_'); //判断是否存在上级结点
if(d!=-1)SearchParentNodeName=SearchParentNodeName.substring(0,d);//如果存在上级结点,取得上级结点名
for(i=0;i<CheckBoxNum;i++)
{
if(n[i].name.length==NodeName.length&&ParentNodeName==FindParentNode(n[i].name))
{
SameNodeNum+=1; //同级结点数目加一
if(n[i].checked)SameNodeCheckedNum+=1; //同级结点被选中的数目加一
if(n[i].indeterminate)SameNodeCheckSome+=1; //同级结点半选数目加一
}
if(n[i].name.substring(0,NodeName.length)==NodeName&&n[i].name!=NodeName&&n[i].type=='checkbox')
{
SubNodeNum+=1; //子结点数数目加一
if(n[i].checked)SubNodeCheckedNum+=1; //子结点被选中的数目加一
if(n[i].indeterminate)SubNodeCheckSome+=1; //子结点半选数目加一
}
}
if((SameNodeNum==1||SameNodeCheckedNum==0)&&(SubNodeCheckedNum==0)&&!document.all(NodeName).checked)
SubNodeCheckedTF=true; //判断子结点是否被选中
if((SameNodeNum>=0&&SameNodeCheckedNum<SameNodeNum)||SameNodeCheckSome>0||SubNodeCheckSome>0)
document.all(SearchParentNodeName).indeterminate=true;//将上级选中状态改为半选
if((SameNodeCheckedNum==SameNodeNum||SameNodeCheckedNum==0)&&SubNodeCheckSome==0&&SameNodeCheckSome==0)
document.all(SearchParentNodeName).indeterminate=false;//取消上级半选状态
return SearchParentNodeName;
}
function CheckAll(BoxName)
{
SearchNodeName=BoxName;
SearchParentNodeName=BoxName;
SubNodeLength=BoxName.split('_').length;
for(i=0;i<CheckBoxNum;i++)
{
if(n[i].name.substring(0,BoxName.length)==BoxName&&n[i].name!=BoxName&&n[i].type=='checkbox')
{
n[i].indeterminate=false; //取消半选状态
n[i].checked=document.all(BoxName).checked?true:false;//选中所有子结点
}
}
for(j=1;j<SubNodeLength;j++)
{
document.all(CheckSubNode(SearchParentNodeName)).checked=SubNodeCheckedTF?false:true;//如果有子结点被选中,则选中上级结点,返之取消
}
}
document.onclick=function(){if(event.srcElement.type=='checkbox')CheckAll(event.srcElement.name);}
</script><body >
<form name='f1' >
<input type='checkbox' name='bid'><br>
<input type='checkbox' name='bid_01'><br>
<input type='checkbox' name='bid_01_01'><br>
<input type='checkbox' name='bid_01_02'><br>
<input type='checkbox' name='bid_01_02_01'><br>
<input type='checkbox' name='bid_01_02_02'><br>
<input type='checkbox' name='bid_01_02_02_01'><br>
<input type='checkbox' name='bid_01_02_02_02'><br>
<input type='checkbox' name='bid_01_02_02_03'><br>
<input type='checkbox' name='bid_01_02_02_03_01'><br>
<input type='checkbox' name='bid_01_02_02_03_02'><br>
<input type='checkbox' name='bid_01_02_02_03_03'><br>
<input type='checkbox' name='bid_01_02_02_04'><br>
<input type='checkbox' name='bid_01_02_03'><br>
<input type='checkbox' name='bid_01_03'><br>
<input type='checkbox' name='bid_01_04'><br>
<input type='checkbox' name='bid_02'><br>
<input type='checkbox' name='bid_03'><br>
<input type='checkbox' name='bid_04'><br>
<hr>
<input type='checkbox' name='ent' checkmain ><br>
<input type='checkbox' name='ent_01'><br>
<input type='checkbox' name='ent_01_01'><br>
<input type='checkbox' name='ent_02'><br>
<input type='checkbox' name='ent_03'><br>
<input type='checkbox' name='ent_04'><br>
</form>