js多选无限极树

 上周帮朋友写的一个多选树，需要的朋友可以看看。可以自己扩展为AJAX的。

下载地址

/** 无限极tree @author:YCF 2009.8.4 **/ var MyTree=function(tName/*显示的名称*/,tValue/*值*/){ this.tName=tName; this.tValue=tValue; this.father=null; this.childs=new Array(); this.HTMLValue=""; this.show=false; this.task=0; this.childtask=0; this.valueTask=0; //this.trueValue=""; this.init=function(){ /*var strInit= new MyTree.StringBuild(); strInit.push("<IMG src="extag.gif" mce_src="extag.gif" name='img"+tValue+"' width='16' height='16'>"); strInit.push("<INPUT type=checkbox value='"+tValue+"' name='cn"+tValue+"'> "); strInit.push("<SPAN>"+tName+"</SPAN>"); strInit.push("<DIV id='child"+tValue+"' name='child"+tValue+"'>");*/ this.HTMLValue+="<DIV id='slfe"+tValue+"'><IMG src="sstag.gif" mce_src="sstag.gif" id='img"+tValue+"' name='img"+tValue+"' width='16' height='16'>"; this.HTMLValue+="<INPUT type=checkbox value='"+tValue+"' name='cn"+tValue+"' id='cn"+tValue+"'> "; //this.HTMLValue+="<INPUT type='hidden' value='0' name='task"+tValue+"' id='task"+tValue+"'> "; this.HTMLValue+="<SPAN id='sp"+tValue+"'>"+tName+"</SPAN></DIV>"; this.HTMLValue+="<DIV id='child"+tValue+"' name='child"+tValue+"'>"; }; this.init(); }; //闭合事件 MyTree.IsHide=function (Obj){ var img=document.getElementById("img"+Obj.tValue); var sp=document.getElementById("sp"+Obj.tValue); var tDiv=document.getElementById("child"+Obj.tValue); img.onclick=sp.onclick=function(){ var temp=Obj.childs.length; if(temp==0) return; if(tDiv.style.display==""){ img.src="extag.gif"; tDiv.style.display="none"; } else{ img.src="sstag.gif"; tDiv.style.display=""; } }; }; //选择事件 MyTree.IsCheck=function (Obj){ var check=document.getElementById("cn"+Obj.tValue); check.onclick=function(){ if(check.checked){ Obj.checkChild(); Obj.checkFather(); } else{ Obj.unCheckChild(); Obj.unCheckFather(); } }; }; //选中时子节点 MyTree.prototype.checkChild=function (){ var check=document.getElementById("cn"+this.tValue); check.checked = "checked"; var temp=this.childs.length; if(temp==0) return; for(this.childtask=0;this.childtask<temp;this.childtask++) this.childs[this.childtask].checkChild(); this.childtask=0; }; //选中时父节点 MyTree.prototype.checkFather=function (){ var check=document.getElementById("cn"+this.tValue); check.checked = "checked"; if(this.father==null) return; this.father.checkFather(); }; //不选中时子节点 MyTree.prototype.unCheckChild=function (){ var check=document.getElementById("cn"+this.tValue); check.checked =""; var temp=this.childs.length; if(temp==0) return; for(this.childtask=0;this.childtask<temp;this.childtask++) this.childs[this.childtask].unCheckChild(); this.childtask=0; }; //不选中时父节点 MyTree.prototype.unCheckFather=function (){ if(this.father==null) return; var isCheck=false; var div=document.getElementById("child"+this.father.tValue); for(var i=0;i<div.all.length;i++) { if(div.all[i].type=="checkbox"){ if(div.all[i].checked) { isCheck=true; break; } } } var check=document.getElementById("cn"+this.father.tValue); if(isCheck){ check.checked = "checked"; } else{ check.checked = ""; this.father.unCheckFather(); } }; //设置事件 MyTree.prototype.setCheck=function (){ new MyTree.IsCheck(this); var slfe=document.getElementById("slfe"+this.tValue); for(j=1;j<this.getFatherS();j++) slfe.insertAdjacentHTML("afterBegin","  "); var temp=this.childs.length; if(temp==0) return; new MyTree.IsHide(this); for(this.task;this.task<temp;this.task++){ //alert(i+"--temp="+temp); this.childs[this.task].setCheck(); } //i=0; }; //判断子节点是否选中 MyTree.prototype.isCheck=function (){ var check=document.getElementById("cn"+this.tValue); var temp=this.childs.length; if(check.checked&&temp==0) return true; for(i=0;i<temp;i++){ this.childs[i].isCheck(); } return false; }; //取得父节点数 MyTree.prototype.getFatherS=function (){ var temp=this.father; var i=1; while(temp!=null){ temp=temp.father; i++; } return i; }; //返回HTML MyTree.prototype.getHTML=function (){ return this.HTMLValue+"</DIV>"; }; //返回值 MyTree.prototype.getValue=function (){ var tempValue=""; var temp=this.childs.length; if(temp==0){ var check=document.getElementById("cn"+this.tValue); if(check.checked) return this.tValue; else return ""; } //var div=document.getElementById("child"+this.tValue); for(this.valueTask=0;this.valueTask<temp;this.valueTask++) { var tm=this.childs[this.valueTask].getValue(); if(tm!="") tempValue+=tm+";"; } if(tempValue.length>0) tempValue=tempValue.substring(0,tempValue.length-1); return tempValue; }; //设置父节点 MyTree.prototype.setFather=function (obj){ this.father=obj; }; //添加元素 MyTree.prototype.appendChild=function (obj){ if(!this.show){ this.HTMLValue+=""+obj.getHTML(); } else{ document.getElementById("child"+this.tValue).insertAdjacentHTML("beforeEnd","  "+obj.getHTML()); } obj.setFather(this); this.childs.push(obj); }; //显示出控件(无父节点) MyTree.prototype.showView=function (){ //document.writeln(this.HTMLValue); document.body.innerHTML=this.HTMLValue; this.show=true; this.setCheck(); }; //显示出控件(有父节点) MyTree.prototype.showView=function (fatherid){ this.HTMLValue+="</DIV>"; var temp=this.HTMLValue; if(document.getElementById(fatherid)!=null){ document.getElementById(fatherid).innerHTML=temp; } else document.body.innerHTML=this.HTMLValue; this.show=true; this.setCheck(); };