一个用JS写的树状目录

Cls_jsTree.js
/**
名称:  js目录树
Name:  jsTree
Release: 0.01
Author:  小竹
Revision: 2005-10-29 16:30:40
Licenses: GPL(The GNU General Public License)
Descript: js目录树
*/


var Icon={
  open  :'Images/folderopen.gif',
  homepage :'Images/home.gif',
  close  :'Images/folder.gif',
  file  :'Images/file.gif',
  help  :'Images/help.gif',
  join  :'Images/T.gif',
  joinbottom :'Images/L.gif',
  plus  :'Images/Tplus.gif',
  plusbottom :'Images/Lplus.gif',
  minus  :'Images/Tminus.gif',
  minusbottom :'Images/Lminus.gif',
  blank  :'Images/blank.gif',
  line  :'Images/I.gif',
  mudule  :'Images/mudule.gif',
  root  :'Images/root.gif'
};

function PreLoad(){
 for(i in Icon){
 var tem=Icon[i]
 Icon[i]=new Image()
 Icon[i].src=tem
 }
}
PreLoad()

function Cls_jsTree(obj,target,ExpandOne){
 this.obj=obj;
 this.Tree=new Node(0)
 this.Root=null
 this.Nodes=new Array()
 this.target=target?target:"FrameMain";
 this.ie=document.all?1:0;
 this.ExpandOne=ExpandOne?1:0
}

function Node(id,pid,txt,link,title,target,xicon){
 this.Index=null;
 this.id=id;
 this.pid=pid
 this.parent=null
 this.txt=txt?txt:"New Item"
 this.link=link
 this.title=title?title:this.txt
 this.target=target
 this.xicon=xicon
 this.indent=""
 this.hasChild=false;
 this.lastNode=false;
 this.open=false
}

Cls_jsTree.prototype.add=function(id,pid,txt,link,title,target,xicon){
 target=target?target:this.target
 var nNode=new Node(id,pid,txt,link,title,target,xicon);
 if(pid==this.Tree.id)nNode.open=true;
 nNode.Index=this.Nodes.length
 this.Nodes[this.Nodes.length]=nNode
}

Cls_jsTree.prototype.InitNode=function(oNode){
 var last;
 for(i=0;i  if(this.Nodes[i].pid==oNode.id){this.Nodes[i].parent=oNode;oNode.hasChild=true}
  if(this.Nodes[i].pid==oNode.pid)last=this.Nodes[i].id
 }
 if(last==oNode.id)oNode.lastNode=true
}

Cls_jsTree.prototype.DrawLine=function(pNode,oNode){
 oNode.indent=pNode.indent+(oNode.pid!=this.Tree.id&&oNode.pid!=this.Root.id?(""):'')
}

Cls_jsTree.prototype.DrawNode=function(nNode,pNode){
 var str=""
 var indents=""
 var imgFolder=""
 var nid=nNode.id
 var nIndex=nNode.Index;
 this.DrawLine(pNode,nNode)
 if(nNode.hasChild)
  indents=nNode.indent+(this.Tree.id!=nNode.pid?(""):"")
 else
  indents=nNode.indent+(nNode.pid==this.Tree.id?'':(""))
 imgFolder=""
 str+="

"+indents+""+imgFolder+this.DrawLink(nNode)+"
"
 if(nNode.hasChild){
  str+="
"
  str+=this.DrawTree(nNode)
  str+="
"
 }
 return str;
}

Cls_jsTree.prototype.DrawTree=function(pNode){
 var str=""
 for(var i=0;i  if(this.Nodes[i].pid==pNode.id)
  str+=this.DrawNode(this.Nodes[i],pNode)
  return str
}

Cls_jsTree.prototype.DrawLink=function(oNode){
 var str=""
 sArray=oNode.txt.split('|');
 dispTxt=sArray[0];
 dispTitle=sArray[1];
 if(oNode.txt.indexOf("|",0)==-1){dispTitle=""}
 str+=" "+(oNode.link?(""+dispTxt+""):dispTxt)+""
 return str
}

Cls_jsTree.prototype.toString=function(){
 var str=""
 for(var i=0;i  if(!this.Root)
  if(this.Nodes[i].pid==this.Tree.id)this.Root=this.Nodes[i]
  this.InitNode(this.Nodes[i])
 }
 str+=this.DrawTree(this.Tree)
 return str
}

Cls_jsTree.prototype.Toggle=function(nIndex,o){
 var nNode=this.Nodes[nIndex]
 //o.blur();
 if(!nNode.hasChild)return;
 if(nNode.open)this.Collapse(nNode)
 else this.Expand(nNode)
}

Cls_jsTree.prototype.Expand=function(nNode){
 var nid=nNode.id
 var node=this.GetElm('Child'+nid)
 var oicon=this.GetElm('icon'+nid)
 node.style.display=''
 var img1=new Image()
 img1.src=(nNode.lastNode?Icon.minusbottom.src:Icon.minus.src)
 if(oicon)oicon.src=img1.src
 if(!nNode.xicon){
  var img2=new Image()
  img2.src=Icon.open.src
  this.GetElm("folder"+nid).src=img2.src
 }
 if(this.ExpandOne)this.CloseOtherItem(nNode);
 nNode.open=true
}

Cls_jsTree.prototype.Collapse=function(nNode){
 var nid=nNode.id
 var node=this.GetElm('Child'+nid)
 var oicon=this.GetElm('icon'+nid)
 node.style.display='none'
 var img1=new Image()
 img1.src=(nNode.lastNode?Icon.plusbottom.src:Icon.plus.src)
 if(oicon)oicon.src=img1.src
 if(!nNode.xicon){
  var img2=new Image()
  img2.src=Icon.close.src
  this.GetElm("folder"+nid).src=img2.src
 }
 nNode.open=false
}

Cls_jsTree.prototype.ExpandAll=function(){
 for(i=0;i  if(this.Nodes[i].hasChild)this.Expand(this.Nodes[i])
}

Cls_jsTree.prototype.CollapseAll=function(){
 for(i=0;i  if(this.Nodes[i].hasChild&&this.Nodes[i].pid!=this.Tree.id&&this.Nodes[i]!=this.Root)this.Collapse(this.Nodes[i])
}

Cls_jsTree.prototype.CloseOtherItem=function(nNode){
 for(var i=0;i  if(this.Nodes[i].pid==nNode.pid&&this.Nodes[i].open){this.Collapse(this.Nodes[i]);break}
}
Cls_jsTree.prototype.Select=function(objNode,flag){
 if(!this.current)this.current=objNode
 this.current.className=""
 objNode.className="highlight"
 this.current=objNode
 var a=objNode.getElementsByTagName("A")
 if(a.length!=0&&flag)window.open(a[0].href,a[0].target);
 if(this.ie)objNode.focus()
}

Cls_jsTree.prototype.openTo=function(nIndex){
 if(nIndex<0||nIndex>=this.Nodes.length)return;
 var nNode=this.Nodes[nIndex]
 while(nNode){
  if(!nNode.open&&nNode.hasChild)this.Expand(nNode)
  nNode=nNode.parent
 }
 this.Select(this.GetElm("NodeItem"+this.Nodes[nIndex].id),true)
}

Cls_jsTree.prototype.GetElm=function(uid){
 return document.getElementById(uid)
}




无标题文档






 
     
 
 

      


      

 


     
        

你可能感兴趣的:(WEB开发)