Primitive code from the Internet to download, after I rewrite, more powerful, more convenient to use, can have an unlimited level of directory, one-time load, you can set the tree node and leaf node color and icon, you can expand and shrink, you can display the current location of the path, click on the tree node in the expansion when only display the tree node hyperlinks, however, It has been tested that the browser displays "This script slows down the browser" When you load 500 nodes at once, but choosing not to cancel the execution does not affect your browser's performance.
Function folder (Folderdescription, Hreference,parentid,target) {
Constant data;
This.desc = folderdescription;
This.parentid=parentid;
This.hreference = hreference;
This.target=target;
this.id = index;
this.navobj = 0;
this.iconimg = 0;
this.nodeimg = 0;
This.islastnode = 0;
Dynamic Data
This.isroot = true;
This.isopen = true;
this.iconsrc=imageurl+ "Ftv2folderopen.gif";
This.iconroot =imageurl+ "Ftv2folderopen.gif";
This.children = new Array;
This.nchildren = 0;
Methods
This.initialize = Initializefolder;
This.setstate = Setstatefolder;
This.addchild = Addchild;
This.createindex = Createentryindex;
This.hide = Hidefolder;
This.display = display;
This.renderob = Drawfolder;
This.totalheight = Totalheight;
This.subentries = foldersubentries;
This.outputlink = Outputfolderlink;
}
function Setstatefolder (isopen) {
var subentries;
var totalheight;
var fit = 0;
var i = 0;
if (isopen = = This.isopen)
Return
if (browserversion = = 2) {
Totalheight = 0
for (i = 0; i < This.nchildren; i++)
Totalheight = Totalheight + this.children[i].navobj.clip.height;
subentries = This.subentries ();
if (This.isopen)
Totalheight = 0-totalheight;
for (fit = this.id + subentries + 1; fit < nentries; fit++)
Indexofentries[fit].navobj.moveby (0, totalheight);
}
This.isopen = IsOpen;
Propagatechangesinstate (this);
}
function Propagatechangesinstate (folder) {
var i = 0;
if (Folder.isopen) {
if (folder.nodeimg) {
if (Folder.islastnode)
FOLDER.NODEIMG.SRC = imageurl+ "Ftv2mlastnode.gif";
Else
FOLDER.NODEIMG.SRC = imageurl+ "Ftv2mnode.gif";
}
if (this.isroot)
FOLDER.ICONIMG.SRC = imageurl+ "Ftv2_mail.gif";
Else
FOLDER.ICONIMG.SRC = imageurl+ "Ftv2folderopen.gif";
for (i = 0; i < Folder.nchildren; i++)
Folder.children[i].display ();
}
else {
if (folder.nodeimg) {
if (Folder.islastnode)
FOLDER.NODEIMG.SRC = imageurl+ "Ftv2plastnode.gif";
Else
FOLDER.NODEIMG.SRC = imageurl+ "Ftv2pnode.gif";
}
if (this.isroot)
FOLDER.ICONIMG.SRC = imageurl+ "Ftv2_mail.gif";
Else
FOLDER.ICONIMG.SRC = imageurl+ "Ftv2folderclosed.gif";
for (i = 0; i < Folder.nchildren; i++)
Folder.children[i].hide ();
}
}
function Hidefolder () {
if (browserversion = = 1) {
if (This.navobj.style.display = "None")
Return
This.navobj.style.display = "None";
}
else {
if (this.navobj.visibility = = "Hiden")
Return
this.navobj.visibility = "Hiden";
}
This.setstate (0);
}
function Initializefolder (level, Lastnode, leftside) {
var i = 0;
var j = 0;
var numberoffolders;
var Numberofdocs;
NC = This.nchildren;
This.createindex ();
var NC;
var Auxev = "";
if (browserversion > 0)
Auxev = "<a href=" Javascript:clickonnode ("+this.id+") ' > ';
Else
Auxev = "<a>";
if (Level > 0) {
if (lastnode) {//the last ' brother ' in the children array
This.renderob (leftside + Auxev + "</a> ");
Leftside = leftside + " ';
This.islastnode = 1;
}
else {
This.renderob (leftside + Auxev + "</a> ");
Leftside = leftside + " ';
This.islastnode = 0;
}
}
else {
This.renderob ("");
}
if (NC > 0) {
Level = level + 1;
for (i = 0; i < This.nchildren; i++) {
if (i = = this.nchildren-1)
This.children[i].initialize (level, 1, leftside);
Else
This.children[i].initialize (level, 0, leftside);
}
}
}
function Drawfolder (leftside) {
if (browserversion = = 2) {
if (!doc.ypos)
Doc.ypos = 8;
Doc.write ("<layer id= ' folder" + this.id + "' top=" + Doc.ypos + "visibility=hiden>");
}
Doc.write ("<table")
if (browserversion = 1)
Doc.write ("id= ' folder" + this.id + "' style= ' Position:block;") ");
Doc.write ("border=0 cellspacing=0 cellpadding=0>");
Doc.write ("<tr><td>");
Doc.write (leftside);
This.outputlink ();
Doc.write ("if (leftside = = "") {
Doc.write ("src= '" + this.iconroot+ "' border=0></a>");
}
else {
Doc.write ("src= '" + this.iconsrc+ "' border=0></a>");
}
Doc.write ("</td><td nowrap>");
Doc.write ("<div class=\" fldrroot\ ">");
if (leftside = = "") {
if (usetextlinks) {
This.outputlink ();
Doc.write (' <font size= "2" color= "' +flodercolor+ '" > ' +this.desc + ' </font></a> ");
}
Else
Doc.write (THIS.DESC);
}
else {
Doc.write ("<a href=" Javascript:clickonnode ("+this.id+") ' > ');
Doc.write (' <font size= "2" color= "' +flodercolor+ '" > ' +this.desc + ' </font></a> ");
}
Doc.write ("</div>");
Doc.write ("</td>");
Doc.write ("</table>");
if (browserversion = = 2) {
Doc.write ("</layer>");
}
if (browserversion = 1) {
This.navobj = doc.all["folder" +this.id];
this.iconimg = doc.all["Foldericon" +this.id]
This.nodeimg = doc.all["Nodeicon" +this.id]
}
Else if ( Browserversion = = 2) {
This.navobj = doc.layers["folder" +this.id];
this.iconimg = this.navobj.document.images["Foldericon" +this.id];
This.nodeimg = this.navobj.document.images["Nodeicon" +this.id];
Doc.ypos = Doc.ypos + this.navobj.clip.height;
}
<body bgcolor= #c0c693 leftmargin=5 topmargin=5 marginwidth= "5" marginheight= "5"
<script Language=javascript src= ". /leftfiles/treemenu.js "></script>
<script language=javascript>
//The following three items can be set or can be by default, Main and Parent.main are the target frames
Setimageurl ("images/") to be displayed on the link page;//icon path
Setlinkcolor ("#ff0000");//leaf node link color
Setflodercolor ("#ffff00");//tree node link color
Folderstree = Gfldr (' * * introduction ', ', ', ');
Aux1 = Insfldr (Folderstree, "* * organ", Parent.main, "function.htm");
aux2 = Insfldr (Aux1, "* * Office", Parent.main, "function.htm");
Insdoc (Aux2, "main", "* * room", "department/manage/offic.htm");
Insdoc (Aux2, "main", "* * room", "department/manage/employee.htm");
Insdoc (Aux2, "main", "* * room", "department/manage/finance.htm");
aux2 = Insfldr (Aux1, "* * Office", Parent.main, "function.htm");
Insdoc (Aux2, "main", "* * room", "department/manage/law.htm");
Insdoc (Aux2, "main", "* * room", "department/manage/manage.htm");
Insdoc (Aux2, "main", "* * room", "department/manage/custody.htm");
Insdoc (Aux2, "main", "* * room", "department/manage/marketmanage.htm");
Aux3 = Insfldr (aux2, "* * Office", Parent.main, "function.htm");
Insdoc (Aux3, "main", "* * room", "department/manage/policy.htm");
Insdoc (Aux3, "main", "* * room", "department/manage/disposition.htm");
Aux1 = Insfldr (Folderstree, "* * center", Parent.main, "department/business/function.htm");
aux2 = Insfldr (Aux1, "* * Office", Parent.main, "function.htm");
Insdoc (Aux2, "main", "* * room", "department/manage/offic.htm");
Insdoc (Aux2, "main", "* * room", "department/manage/employee.htm");
Insdoc (Aux2, "main", "* * room", "department/manage/finance.htm");
aux2 = Insfldr (Aux1, "* * Office", Parent.main, "function.htm");
Insdoc (Aux2, "main", "* * room", "department/manage/law.htm");
Insdoc (Aux2, "main", "* * room", "department/manage/manage.htm");
Insdoc (Aux2, "main", "* * room", "department/manage/custody.htm");
Insdoc (Aux2, "main", "* * room", "department/manage/marketmanage.htm");
Aux3 = Insfldr (aux2, "* * Office", Parent.main, "function.htm");
Insdoc (Aux3, "main", "* * room", "department/manage/policy.htm");
Insdoc (Aux3, "main", "* * room", "department/manage/disposition.htm");
Initializedocument ();
</script>
function Outputfolderlink () {
if (this.hreference && this.target) {
Doc.write ("<a href=" + this.hreference + "' target=\" "+this.target.name+" \ ")
if (Browserversion > 0) {
Doc.write ("onclick= ' Javascript:clickonfolder (" +this.id+ ")")
}
Doc.write (">")
}
Else
Doc.write ("<a>")
}
function Addchild (childnode) {
Selectfile[fentries]=childnode.desc;
fentries++;
This.children[this.nchildren] = Childnode;
this.nchildren++;
return (Childnode);
}
function Foldersubentries () {
var i = 0;
var se = This.nchildren;
for (i = 0; i < This.nchildren; i++) {
if (This.children[i].children)//is a folder
SE = se + this.children[i].subentries ();
}
return (SE)
}
Definition of class item (a document or link inside a folder)
function item (itemdescription, Hreference, Itemlink, Itemimg,parentid)//constructor
{
Constant data
This.desc = ItemDescription
This.link = Itemlink
This.hreference = hreference;
This.id =index;
this.navobj = 0; Initialized in Render ()
this.iconimg = 0; Initialized in Render ()
ICONSRC-June tumor Lek-gu, the tumor is quite old, a wine-fishing robe Junga, and recommend the waste eggplant to promote (lattice brazing)
THIS.ICONSRC = itemimg;
Methods
This.initialize = Initializeitem;
This.createindex = Createentryindex;
This.hide = Hideitem;
This.display = display;
This.renderob = DrawItem;
This.totalheight = Totalheight;
This.parentid=parentid;
alert (this.parent);
}
function Hideitem () {
if (browserversion = = 1) {
if (This.navobj.style.display = "None")
Return
This.navobj.style.display = "None"
}
else {
if (this.navobj.visibility = = "Hiden")
Return
this.navobj.visibility = "Hiden";
}
}
function Initializeitem (level, Lastnode, leftside) {
This.createindex ();
if (Level > 0) {
if (lastnode) {//the last ' brother ' in the children array
This.renderob (leftside + "Leftside = leftside + " '
}
else {
This.renderob (leftside + "Leftside = leftside + " '
}
}
Else
This.renderob ("")
}
function DrawItem (leftside) {
if (browserversion = 2)
Doc.write ("<layer id= ' item" + this.id + "' top=" + Doc.ypos + "visibility=hiden>");
Doc.write ("<table");
if (browserversion = 1)
Doc.write ("id= ' item" + this.id + "' style= ' position:block; ') ");
Doc.write ("border=0 cellspacing=0 cellpadding=0>");
Doc.write ("<tr><td>");
Doc.write (leftside);
if (This.link!= "") Doc.write ("<a onclik=\ ' Veiwfile" ("+this.id+") \ ' href= "+ This.link +" > ");
Doc.write ("Doc.write ("src= '" +this.iconsrc+ "' border=0>")
if (This.link!= "")
Doc.write ("</a>");
Doc.write ("</td><td nowrap>");
Doc.write ("<div class=\" fldritem\ ">");
if (usetextlinks) {
if (This.link!= "")
Doc.write ("<a onclick=\" Veiwfile ("+this.id+") \ ' href= "+ this.link + ' ><font size= ' 2" color= "' +linkcolor+ '" > ' + this.desc + ' </font></a> ');
Else
Doc.write (THIS.DESC);
}
else {
Doc.write (THIS.DESC);
}
Doc.write ("</div>");
Doc.write ("</table>")
if (browserversion = 2)
Doc.write ("</layer>");
if (browserversion = = 1) {
This.navobj = doc.all["Item" +this.id]
this.iconimg = doc.all["Itemicon" +this.id]
}
else if (browserversion = 2) {
This.navobj = doc.layers["item" +this.id];
this.iconimg = this.navobj.document.images["Itemicon" +this.id];
Doc.ypos = Doc.ypos+this.navobj.clip.height;
}
}
Function Addposition (id,str1) {
if (id>0) {
clickedfolder = Indexofentries[id];
parentid=clickedfolder.parentid;
parentname=indexofentries[parentid];
pa=parentname.desc;
if (parentid==0) str=pa+str1;
else str= ' </font><font size=\ ' 2\ ' color=\ ' #8f8f8f \ ' >-></font><font size=\ ' 2\ ' Color= "#aa0000" > ' +pa+str1;
addposition (PARENTID,STR);
}
}
var str= "";
function Veiwfile (msg) {
var typelogo=typeof top.logo;
if (typelogo== "undefined") return;
var tpyeframe=typeof top.logo.top1;
if (tpyeframe== "undefined") return;
Objdocument= Top.logo.top1;
var foldertext= "";
if (msg==0) foldertext=selectfile[msg];
else {
Str= ' </font><font size=\ "2\" color=\ "#8f8f8f \" >-></font></font><font size=\ "2\" Color= "#aa0000" > ' +selectfile[msg];
Addposition (MSG,STR);
FOLDERTEXT=STR;
}
Objdocument.document.open ();
Objdocument.document.write (' <font size=\ 2\ "color=\" #8f8f8f \ "> Current location: </font> <font size=\" 2\ "color=" #aa0000 "> ' +foldertext+" </font> ");
Objdocument.document.close ();
}
Methods common to both objects (Pseudo-inheritance)
function display () {
if (browserversion = 1)
This.navobj.style.display = "block";
Else
This.navobj.visibility = "show";
}
function Createentryindex () {
Indexofentries[nentries] = this;
nentries++;
}
Total height of subentries open
function Totalheight () {//used with browserversion = = 2
var h = this.navobj.clip.height;
var i = 0;
if (This.isopen) {//is a folder and _is_ open
for (i = 0; i < This.nchildren; i++)
H = h + this.children[i].totalheight ();
}
Return h
}
Events
function Clickonfolder (FolderID) {
var clicked = Indexofentries[folderid];
if (!clicked.isopen)
Clickonnode (FolderID);
if (clicked.isselected)
Return
}
function Clickonnode (FolderID) {
var clickedfolder = 0;
var state = 0;
Clickedfolder = Indexofentries[folderid];
state = Clickedfolder.isopen;
if (!state) {
if (clickedfolder.target) clickedfolder.target.location=clickedfolder.hreference; Show Related LINKS page when clicking folder
Veiwfile (FolderID);
}
Clickedfolder.setstate (!state); Open<->close
}
function Initializedocument () {
if (Doc.all)
Browserversion = 1; ie4
else if (doc.layers)
Browserversion = 2; Ns4
Else
browserversion = 0; Other
Folderstree.initialize (0, 1, "");
Folderstree.display ();
if (Browserversion > 0) {
Doc.write ("<layer top=" +indexofentries[nentries-1].navobj.top+ "> </layer>");
Close the whole tree
Clickonnode (0);
Open the root folder
Clickonnode (0);
}
}
Auxiliary functions for FOLDER-TREEE backward compatibility
function Gfldr (description, Hreference,parentid,target) {
Var des;
index++;
if (fentries==0) {
Selectfile[fentries]=description;
fentries++;
}
Des=description;
folder = new Folder (DES, Hreference,parentid,target);
return (folder);
}
function Glnk (target, description, Linkdata, Itemimg,parentid) {
Fulllink = ""
if (target = = 0 | | target== "") {
if (Linkdata!= "")
Fulllink = "' +linkdata+" ' target=\ "_blank\" ";//displayed in the newly opened form
Else
Fulllink = "";
}
if (target = = 1) {
if (Linkdata!= "")
Fulllink = "' +linkdata+" ' target=\ "_slef\";//display in the frame or form where the form is located
Else
Fulllink = "";
}
else if (target = = 2) {
if (Linkdata!= "")
Fulllink = "' +linkdata+" ' target=\ "_parent\"; Display in the parent frame of the frame that contains the form
Else
Fulllink = "";
}
else if (target = = 3) {
if (Linkdata!= "")
Fulllink = "' +linkdata+" ' target=\ "_top\" ";//displayed in the top-level form
Else
Fulllink = "";
}
else {//alert (target);
if (Linkdata!= "")
Fulllink = "'" "+linkdata+" ' target= "+target;//displayed in the target form
Else
Fulllink = "";
}
index++; Current node number
Linkitem = new Item (description, Linkdata, Fulllink, Itemimg,parentid)
Return Linkitem
}
function Insfldr (ParentFolder, childfolder,target,hreference) {
var child;
var desc;
Parentid=parentfolder.id;
Child=gfldr (Childfolder,hreference,parentid,target);
Return (Parentfolder.addchild (child));
}
function Insdoc (parentfolder,target, description, Linkdata, itemimg) {
var document;
var itemimg;
itemimg=imageurl+ "Bu.gif";
var desc;
Parentid=parentfolder.id;
Document=glnk (target, description, Linkdata, Itemimg,parentid);
Parentfolder.addchild (document);
}
function Setobjdocument (msg) {
if (msg!=null) {
objdocument=msg;
}
}
Set expand, shrink picture path
function Setimageurl (msg) {
if (msg==null) {
Imageurl= ". /leftfiles/images/";
}else imageurl=msg;
}
Set hyperlink text color
function Setlinkcolor (msg) {
linkcolor=msg;
}
function Setflodercolor (msg) {
flodercolor=msg;
}
Global variables
Usetextlinks = 1;
indexofentries = new Array;
nentries = 0;
Index=-1; Node number
doc = document;
browserversion = 0;
Selectedfolder = 0;
Selectfile=new Array;
fentries=0;
var Objdocument,imageurl;
var linkcolor= "#085dde";
var flodercolor= "#292c08";
var type1=typeof top.logo;
if (type1== "undefined") {
Objdocument=null;
}
if (imageurl==null) {
Setimageurl (ImageUrl);
}
Merge the code from the source code and the incoming code into a treemenu.js file, which can be introduced into the page