樹形結構完全封裝

最新樹形結構完全封裝

以下是三零網為大家整理的最新樹形結構完全封裝的文章，希望大家能夠喜歡!

<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'>rn";

   this.footer="</table>rn";

   this.style= "<style type='text/css'>rn";

   this.style+="  td{white-space: nowrap;font:9pt/150% '宋體';}rn";

   this.style+="  .on{cursor:hand;background-color:#B5BED6;border:1px solid #08246B;}rn";

   this.style+="  .click{cursor:hand;background-color:#FFFFFF;border:1px solid #B5BED6;}rn";

   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'>rn    <td><table style='margin-left:15' border='0'  height='20' cellspacing='0' cellpadding='1'>rn";

                   var nodeFooter="</table></td>rn  </tr>rn";

                   var treeHead="  <tr>rn";

                   treeHead+=   "    <td><span onclick='"+Tname+".nodeClick(this)' onmouseout='"+Tname+".nodeOut(this)' onmouseover='"+Tname+".nodeOver(this)'";

                   var treeFoot="</span></td>rn";

                   treeFoot+=   "  </tr>rn";

                   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);

                        {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<l && 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]);

                      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]);

                     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.zg700.com","_blank")

  s.addNode(a,"testNodeChild2",0,"http://www.zg700.com","_blank")

  var t=s.addNode(a,"testNodeChildNode1",1)

  s.addNode(t,"testNodeChild1",0,"http://www.zg700.com","_blank")

  s.addNode(t,"testNodeChild2",0,"http://www.zg700.com","_blank")

  s.addNode(n,"testChild2",0,"http://www.zg700.com","_blank")

  s.addNode(n,"testChild3",0,"http://www.zg700.com","_blank")

  var o=s.addNode("root","testRoot2",1)

  s.addNode(o,"testChild1",0,"http://www.zg700.com","_blank")

  d=s.addNode(o,"testChild2",1)

  s.addNode(d,"testChild1",0,"http://www.zg700.com","_blank")

  e=s.addNode(d,"testChild1",1)

  s.addNode(e,"testChild1",0,"http://www.zg700.com","_blank")

  s.addNode(o,"testChild3",0,"http://www.zg700.com","_blank")

  s.show();

</script>

轉載來自：http://www.q3060.com/list3/list115/17.html