加载中…
正文 字体大小:

Dtree目录树的总结

(2009-03-06 10:25:30)
标签:

dtree总结

it

分类: 开源技术

一:函数

1:页面中

tree.add(id,pid,name,url,title,target,icon,iconOpen,open);

 

参数说明:

 

id         :节点自身的id

 

pid       :节点的父节点的id

 

name    :节点显示在页面上的名称

 

url        :节点的链接地址

 

title      :鼠标放在节点上所出现的提示信息

 

target   :节点链接所打开的目标frame(如框架目标mainFrame或是_blank,_self之类)

 

icon      :节点关闭时的显示图片的路径

 

iconOpen:节点打开时的显示图片的路径

 

open    :布尔型,节点是否打开(默认为false

 

注:open项:顶级节点一般采用true,即pid是-1的节点

 

 

2dtree.js文件中

87113行是一些默认图片的路径,注意要指对。

 

二:页面中的书写

 

1:默认值的书写规则(从左至右,依次省略)

tree.add(id,pid,name,url);后面5个参数可以省略

 

2:有间隔时的默认值(如存在第6个参数,但第5个参数想用默认值)

tree.add(id,pid,name,url,"",target);必须这样写

其他 tree.add(id,pid,name,url,"","","","",true);

 

3:样式表

1):可以将dtree.css中的样式附加到你的应用中的主css中,如a.css

2):也可以同时引用dtree.cssa.css两个文件,但前提条件是两个css文件中不能有重复的样式

<link href="/jingjindatabase/pub/css/a.css" rel="stylesheet" type="text/css" />
<link href="/jingjindatabase/pub/css/dtree.css" rel="stylesheet" type="text/css" />

 

4:页面代码书写的位置是:一般写在表格的td之中

<script type="text/javascript" src="/myMobanGis/pub/js/dtree.js"></script>
<script type="text/javascript">
tree = new dTree('tree');
tree.add("1","-1","
京津","","","","","",true);
tree.add("11","1","A","","","","","",true);
 tree.add("110","11","A-1","content.jsp?moduleName=XXX","","mainFrame");
 tree.add("111","11","A-2","javascript:void(0)","","
链接在哪里显示");
 tree.add("112","11","A-3","javascript:void(0)","","mainFrame");
 tree.add("113","11","A-4","/.jsp","","mainFrame");
 tree.add("114","11","A-5","/.jsp","","mainFrame");
 tree.add("115","11","A-6","/.jsp","","mainFrame");
 
tree.add("12","1","B","","","","","",true);
 tree.add("121","12","B-1","javascript:
调用本页内的js函数","","mainFrame");
 tree.add("122","12","B-2");

tree.add("13","1","C","","","","","",true);
 tree.add("131","13","C-1","javascript:void(0)","","mainFrame");
 tree.add("132","13","C-2","javascript:void(0)","","mainFrame");
 tree.add("133","13","C-3","javascript:void(0)","","mainFrame");

tree.add("14","1","D","","","","","",true);
 tree.add("141","14","D-1","javascript:void(0)","","mainFrame");
document.write(tree);
</script>
说明:这是静态的代码,动态的可用循环加入。 

 

三:css文件的注解

 

1:dtree.css

.dtree {//定义目录树节点的字体,字号,颜色
 font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
 font-size: 12px;
 color: #006600;
 white-space: nowrap;
}
.dtree img {//
定义选用节点图标的样式,位置
 border: 0px;
 vertical-align: middle;
}
.dtree a {//
 color: #006600;
 text-decoration: none;
}
.dtree a.node, .dtree a.nodeSel {
 white-space: nowrap;
 padding: 0px 0px 0px 0px;
}
.dtree a.node:hover, .dtree a.nodeSel:hover {
 color: #006600;
 text-decoration: none;
}
.dtree a.nodeSel {
 background-color: #c0d2ec;
}
.dtree .clip {
 overflow: hidden;
}

 

0

阅读 评论 收藏 转载 喜欢 打印举报
  • 评论加载中,请稍候...
发评论

    发评论

    以上网友发言只代表其个人观点,不代表新浪网的观点或立场。

      

    新浪BLOG意见反馈留言板 电话:4006900000 提示音后按1键(按当地市话标准计费) 欢迎批评指正

    新浪简介 | About Sina | 广告服务 | 联系我们 | 招聘信息 | 网站律师 | SINA English | 会员注册 | 产品答疑

    新浪公司 版权所有