一个很实用和好用的资源管理器的树形目录源码

80酷酷网    80kuku.com

  

本原码从网上下载,经本人改写,功能更强大,使用更方便,可以有无限级目录,一次性载入,可以分别设置树结点和叶结点的颜色及图标,可以展开和收缩,可以显示当前所处的路径位置,点击树结点时只在展开时显示树结点的超链接,不过,据测试,一次性载入500个节点时浏览器会显示“该脚本会使浏览器变慢”的提示,不过,选择不取消执行不会影响浏览器的性能。
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 + "<img name='nodeicon" + this.id + "' src='"+imageurl+"ftv2mlastnode.gif' width=16 height=22 border=0></a>");
 leftside = leftside + "<img src=\'"+imageurl+"ftv2blank.gif\' width=16 height=22>";
 this.islastnode = 1;
}
else {
this.renderob(leftside + auxev + "<img name='nodeicon" + this.id + "'src=\'"+imageurl+"ftv2mnode.gif\' width=16 height=22 border=0></a>");
leftside = leftside + "<img src=\'"+imageurl+"ftv2vertline.gif\' width=16 height=22>";
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 + "' ");

doc.write(" border=0 cellspacing=0 cellpadding=0>");
doc.write("<tr><td>");
doc.write(leftside);

this.outputlink();

doc.write("<img name='foldericon" + this.id + "' ");
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>
//以下三项可以设置也可以按默认值,main和parent.main都是链接页面要显示的目标框架
setimageurl("images/"); //图标路径
setlinkcolor("#ff0000");//叶节点链接颜色
setflodercolor("#ffff00");//树结点链接颜色

folderstree = gfldr('***介绍','','');
 aux1 = insfldr(folderstree, "**机关",parent.main,"function.htm");
aux2 = insfldr(aux1 , "**处",parent.main,"function.htm");
insdoc(aux2 , "main", "**室","department/manage/offic.htm");
insdoc(aux2 , "main", "**室", "department/manage/employee.htm");
insdoc(aux2 , "main", "**室","department/manage/finance.htm");

aux2 = insfldr(aux1 , "**处",parent.main,"function.htm");

 insdoc(aux2 , "main", "**室","department/manage/law.htm");
 insdoc(aux2 , "main", "**室","department/manage/manage.htm");
 insdoc(aux2 , "main", "**室", "department/manage/custody.htm");
 insdoc(aux2 , "main", "**室", "department/manage/marketmanage.htm");

aux3 = insfldr(aux2 , "**处",parent.main,"function.htm");

insdoc(aux3 , "main", "**室", "department/manage/policy.htm");
insdoc(aux3 , "main", "**室", "department/manage/disposition.htm");

aux1 = insfldr( folderstree,"**中心",parent.main,"department/business/function.htm");
aux2 = insfldr(aux1 , "**处",parent.main,"function.htm");
insdoc(aux2 , "main", "**室","department/manage/offic.htm");
insdoc(aux2 , "main", "**室", "department/manage/employee.htm");
insdoc(aux2 , "main", "**室","department/manage/finance.htm");

aux2 = insfldr(aux1 , "**处",parent.main,"function.htm");

 insdoc(aux2 , "main", "**室","department/manage/law.htm");
 insdoc(aux2 , "main", "**室","department/manage/manage.htm");
 insdoc(aux2 , "main", "**室", "department/manage/custody.htm");
 insdoc(aux2 , "main", "**室", "department/manage/marketmanage.htm");

aux3 = insfldr(aux2 , "**处",parent.main,"function.htm");

insdoc(aux3 , "main", "**室", "department/manage/policy.htm");
insdoc(aux3 , "main", "**室", "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俊 瘤沥登绰 捞固瘤 颇老阑 阿 酒捞袍俊 嘎霸 瘤沥且 荐 乐档废 茄促 (格钎)
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 + "<img src='"+imageurl+"ftv2lastnode.gif' width=16 height=22>")
leftside = leftside + "<img src='"+imageurl+"ftv2blank.gif' width=16 height=22>"
}
else {
this.renderob(leftside + "<img src='"+imageurl+"ftv2node.gif' width=16 height=22>")
leftside = leftside + "<img src='"+imageurl+"ftv2vertline.gif' width=16 height=22>"
}
}
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 + "' ");
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("<img id='itemicon"+this.id+"' ")
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\"> 当前位置: </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; //点击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\"";//显示在新开的窗体中
else
fulllink = "";
}
if(target == 1) {
if(linkdata != "" )
fulllink = "'"+linkdata+"' target=\"_slef\"";//显示在表单所在的框架或窗体中
else
fulllink = "";
}
else if(target == 2) {
if(linkdata != "")
fulllink = "'"+linkdata+"' target=\"_parent\""; //显示在包含表单的框架的父框架中
else
fulllink = "";
}
else if(target == 3) {
if(linkdata != "")
fulllink = "'"+linkdata+"' target=\"_top\"";//显示在顶层窗体中
else
fulllink = "";
}

else {//alert(target);
if(linkdata != "")
fulllink = "'"+linkdata+"' target="+target;//显示在target窗体中
else
fulllink = "";
}
index++; //当前节点编号

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

//设置展开、收缩图片路径
function setimageurl(msg){
if (msg==null){
 imageurl="../leftfiles/images/";
}else imageurl=msg;
}

//设置超链接文本颜色
function setlinkcolor(msg){
 linkcolor=msg;
}
function setflodercolor(msg){
 flodercolor=msg;
}
// global variables

usetextlinks = 1;
indexofentries = new array;
nentries = 0;
index=-1;  //节点编号
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);
}

将源代码和接前代码中的代码合并成一个treemenu.js文件,在在页面中引入即可



分享到
  • 微信分享
  • 新浪微博
  • QQ好友
  • QQ空间
点击: