关闭

js源码--树

781人阅读 评论(0) 收藏 举报
//这是转贴的

<button onclick=s.moveNext()>next</button><button onclick=s.movePre()>pre</button><button onclick=s.reLoad()>reload</button>
<script>
function eyunTree(Tname)
  
{if(typeof(Tname) != "string" || Tname == "")
     
throw(new Error(-1'创建类实例的时候请把类实例的引用变量名传递进来!'));
   
this.O=null;
   
this.tree="";
   
this.nodes=new Array();
   
this.header="<table border='0'  height='20' cellspacing='0' cellpadding='1'> ";
   
this.footer="</table> ";
   
this.style= "<style type='text/css'> ";
   
this.style+="  td{white-space: nowrap;font:9pt/150% '宋体';} ";
   
this.style+="  .on{cursor:hand;background-color:#B5BED6;border:1px solid #08246B;} ";
   
this.style+="  .click{cursor:hand;background-color:#FFFFFF;border:1px solid #B5BED6;} ";
   
this.style+="</style>";
   
this.addNode=function (parent,text,hasChild,href,target)
                  
{if(hasChild!=1 && arguments.length!=5)
                     
throw(new Error(-2'参数错误!'));
                   
var nodeHeader="  <tr style='display:none'>     <td><table style='margin-left:15' border='0'  height='20' cellspacing='0' cellpadding='1'> ";
                   
var nodeFooter="</table></td>   </tr> ";
                   
var treeHead="  <tr> ";
                   treeHead
+=   "    <td><span onclick='"+Tname+".nodeClick(this)' onmouseout='"+Tname+".nodeOut(this)' onmouseover='"+Tname+".nodeOver(this)'";
                   
var treeFoot="</span></td> ";
                   treeFoot
+=   "  </tr> ";
                   
var treeNode=treeHead+"hasChild='"+hasChild+"'";
                   
if(hasChild!=1)
                     
{treeNode+=" href='"+href+"' target='"+target+"'";
                      
var src="comm/img/tree/leaf.gif";
                     }

                   
else
                     
var src="comm/img/tree/shrink.gif"
                   treeNode
+="><img src='"+src+"' align='absmiddle'>"+text+treeFoot;
                   
if(parent=="root")
                      treeNode
=this.header+treeNode;
                   
if(hasChild==1)
                     
{treeNode+=nodeHeader;
                     }

                   
if(this.tree!="" && this.nodes.length!=0)
                     
{if(parent=="root")
                        
{while(this.nodes.length>0)
                           
{this.tree+=nodeFooter;this.nodes.length--}
                         
this.tree+=this.footer;
                        }

                      
else
                        
{if(this.nodes[this.nodes.length-1]!=parent && this.tree.lastIndexOf(parent)!=this.tree.length-parent.length)
                           
{while(this.nodes.length-1>0)
                             
{if(this.nodes[this.nodes.length-1]!=parent)
                                
this.tree+=nodeFooter;
                              
else
                                
break;
                              
this.nodes.length--
                             }
                              
                           }

                         }

                     }

                   
if(this.nodes[this.nodes.length-1]!=parent)
                     
this.nodes[this.nodes.length]=parent;
                   
this.tree+=treeNode;
                   
return treeNode;
                  }

    
this.nodeOver=function (o)
                  
{o.oldClass=o.className;
                   o.className
="on";
                  }

    
this.nodeOut=function (o)
                   
{o.className=o.oldClass;
                   }

    
this.nodeClick=function (o)
                     
{if(o.hasChild=="1")
                        
{if(o.type=="open")
                           
this.treeClose(o);
                         
else
                           
this.treeOpen(o);
                        }

                      
else
                        
{tmpA.href=typeof o.href=="undefined"?"#":o.href;
                         tmpA.target
=typeof o.target=="undefined"?"_self":o.target;
                         tmpA.click();
                        }

                      
if(this.O!=null)
                        
this.O.className=this.O.oldClass="";
                      
this.O=o;
                      o.oldClass
=o.className="click";
                     }

    
this.treeClose=function (o)
                     
{o=o.parentElement.parentElement;
                      o.nextSibling.style.display
="none";
                      o.firstChild.firstChild.firstChild.src
="comm/img/tree/shrink.gif";
                      o.firstChild.firstChild.type
="close";
                     }


    
this.treeOpen=function (o)
                    
{o=o.parentElement.parentElement;
                     o.nextSibling.style.display
="";s
                     o.firstChild.firstChild.firstChild.src
="comm/img/tree/unwrap.gif";
                     o.firstChild.firstChild.type
="open";
                    }

    
this.moveNext=function ()
                    
{var o=document.getElementsByTagName("SPAN");
                     
var l=o.length;
                     
if(this.O==null)
                       
{o[0].click(o[0]);   
                        
return true;
                       }

                     
for(var i=0;i<l;i++)
                       
if(o[i].className==this.O.className)
                         
break;
                    
if(i<l-1)
                      o[i
+1].click(o[i+1]);
                    
else
                      o[i].click(o[i]);
                    }

    
this.movePre=function ()
                   
{var o=document.getElementsByTagName("SPAN");
                    
var l=o.length;
                    
if(this.O==null)
                      
{o[0].click(o[0]);   
                       
return true;
                      }

                    
for(var i=0;i<l;i++)
                      
if(o[i].className==this.O.className)
                        
break;
                    
if(i<&& i>0)
                      
{var oP=o[i-1].parentElement;
                       
var oC=null;
                       
while(oP!=document.body)
                         
{if(oP.tagName=="TR" && oP.style.display=="none")
                            
{oP.style.display="";
                             oP.previousSibling.firstChild.firstChild.firstChild.src
="comm/img/tree/unwrap.gif";
                             oP.previousSibling.firstChild.firstChild.type
="open";
                            }

                          oP
=oP.parentElement;
                         }

                       o[i
-1].click(o[i-1]);
                      }

                    
else
                      o[
0].click(o[0]);
                   }

    
this.reLoad=function ()
                  
{var o=document.getElementsByTagName("SPAN");
                   
var l=o.length;
                   
if(this.O==null)
                     
{o[0].click(o[0]);   
                      
return true;
                     }

                   
for(var i=0;i<l;i++)
                     
if(o[i].className==this.O.className)
                       
break;
                   
if(i<l)
                     o[i].click(o[i]);
                   
else
                     o[
0].click(o[0]);
                  }

    
this.show=function ()
                
{document.writeln(this.style);
                 document.writeln(
this.tree);
                 document.writeln(
"<a id='tmpA'></a>");
                }

   }

  
var s=new eyunTree("s")
  
var n=s.addNode("root","testRoot1",1)
  
var a=s.addNode(n,"testNode1",1)
  s.addNode(a,
"testNodeChild1",0,"http://www.iecn.net","_blank")
  s.addNode(a,
"testNodeChild2",0,"http://www.iecn.net","_blank")
  
var t=s.addNode(a,"testNodeChildNode1",1)
  s.addNode(t,
"testNodeChild1",0,"http://www.iecn.net","_blank")
  s.addNode(t,
"testNodeChild2",0,"http://www.iecn.net","_blank")
  s.addNode(n,
"testChild2",0,"http://www.iecn.net","_blank")
  s.addNode(n,
"testChild3",0,"http://www.51js.com","_blank")
  
var o=s.addNode("root","testRoot2",1)
  s.addNode(o,
"testChild1",0,"http://www.51js.com","_blank")
  d
=s.addNode(o,"testChild2",1)
  s.addNode(d,
"testChild1",0,"http://www.51js.com","_blank")
  e
=s.addNode(d,"testChild1",1)
  s.addNode(e,
"testChild1",0,"http://www.51js.com","_blank")
  s.addNode(e,
"testChild1",0,"http://www.51js.com","_blank")
  s.addNode(e,
"testChild1",0,"http://www.51js.com","_blank")
  s.addNode(d,
"testChild1",0,"http://www.51js.com","_blank")
  s.addNode(o,
"testChild3",0,"http://www.51js.com","_blank")
  s.show();
</script>
//通过上面的思路写的,以上是封装好的所以比较麻烦

<style>
td{white-space: nowrap;font:9pt/150% 'ËÎÌå'};
.on{cursor:hand;background-color:#B5BED6;border:1px solid #08246B};
.click{cursor:hand;background-color:#FFFFFF;border:1px solid #B5BED6};
</style>
<html>
<body>
<button onclick="moveNext()">next</button><button onclick="movePre()">pre</button><button onclick="reLoad()">reload</button>
</body>
</html>
<script language="JavaScript">
var obj,obj1,flag=0;
function addNode(parent,text,hasChild,href){
if(hasChild==0){
var row=eval(parent).insertRow()
var col=row.insertCell()
col.innerHTML="<span onclick='nodeClick(this,/""+href+"/")' onmousemove='nodeOver(this)' onmouseout='nodeOut(this)'><img src='page.gif' align='absmiddle' border='0' >"+text+"</span>"
}
else{
var row=eval(parent).insertRow()
var col=row.insertCell()
col.innerHTML="<span onclick='nodeClick(this,/""+href+"/")' onmousemove='nodeOver(this)' onmouseout='nodeOut(this)'><img src='plus.gif' align='absmiddle' border='0' >"+text+"</span>"
var row1=eval(parent).insertRow()
var col1=row1.insertCell()
col1.innerHTML="<table id="+text+" style='margin-left:15' border='0' height='20' cellspacing='0' cellpadding='1'></table>"
row1.style.display="none"
}
}

function nodeClick(o,text){
var p=document.getElementsByTagName("SPAN");
l=p.length;
for(var i=0;i<p.length;i++){
p[i].className=""
}
obj1=o;
o.className="on"
if(o.childNodes[0].src=="http://localhost/minus.gif"){
o.childNodes[0].src="http://localhost/plus.gif"
if(o.parentNode.parentNode.nextSibling){
obj=o.parentNode.parentNode
obj.nextSibling.style.display="none"
}
}
else if(o.childNodes[0].src=="http://localhost/plus.gif"){
o.childNodes[0].src="http://localhost/minus.gif"
if(o.parentNode.parentNode.nextSibling){
obj=o.parentNode.parentNode
obj.nextSibling.style.display="";
}
}
else if(o.childNodes[0].src=="http://localhost/page.gif"){
document.getElementById("tmpA").href=text;
document.getElementById("tmpA").target="_blank"
document.getElementById("tmpA").click();
}
}

function nodeOver(o){
o.className="on";
}
function nodeOut(o){
o.className=""
}

function reLoad(){
var o=document.getElementsByTagName("SPAN");
l=o.length;
if(flag==0){
for(var i=0;i<l;i++){
oP=o[i].parentNode
while(oP!=document.body){
if(oP.tagName=="TR" && oP.style.display=="none"){
oP.style.display="";
oP.previousSibling.firstChild.firstChild.firstChild.src="http://localhost/minus.gif";
}
oP=oP.parentElement;
}
}
flag=1
}
else{
for(var i=0 ;i<l-1;i++){
if(o[i].firstChild.src=="http://localhost/minus.gif" ){
o[i].firstChild.src="http://localhost/plus.gif"
oP=o[i].parentNode
while(oP.tagName!="TR"){
oP=oP.parentElement;
}
oP.nextSibling.style.display="none"
}
}
flag=0
}
}

function movePre(){
if(obj1==null)return;
var o=document.getElementsByTagName("SPAN");
l=o.length;
for(var i=0;i<o.length;i++){
if(o[i]==obj1){
break;
}
}
if(i>0&&i<l){
if(o[i].childNodes[0].src=="http://localhost/minus.gif"){
o[i].click();
}
else{
o[i-1].click();
}
}
}

function moveNext(){
if(obj1==null)return;
var o=document.getElementsByTagName("SPAN");
l=o.length;
for(var i=0;i<o.length;i++){
if(o[i]==obj1){
break;
}
}
if(i>=0&&i<l-1){
if(o[i].childNodes[0].src=="http://localhost/plus.gif"){
o[i].click();
}
else {
o[i+1].click();
}
}
}

window.onload=init;
function init(){
mainTable=document.createElement("table");
mainTable.id="root"
document.body.appendChild(mainTable)

href=document.createElement("a");
href.id="tmpA"
document.body.appendChild(href)

addNode("root","testRoot1",1)
addNode("testRoot1","testRoot1_1",1)
addNode("testRoot1_1","testRoot1_1_1",1)
addNode("testRoot1_1_1","testRoot1_1_1_1",0,"http://163.com")
addNode("testRoot1_1_1","testRoot1_1_1_2",0,"#")
addNode("testRoot1_1_1","testRoot1_1_1_3",0,"#")
addNode("root","testRoot2",1)
addNode("testRoot2","testRoot2_1",1)
addNode("testRoot2_1","testRoot2_1_1",1)
addNode("testRoot2_1_1","testRoot2_1_1_1",0,"#")
addNode("testRoot2","testRoot2_2",0,"#")
}
</script>
0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:199468次
    • 积分:2639
    • 等级:
    • 排名:第13800名
    • 原创:59篇
    • 转载:84篇
    • 译文:0篇
    • 评论:80条
    最新评论