dtree 简单使用案例

1.引用js,css：

<script type="text/javascript" src="*/js/dtree/dtree.js"></script>
<link rel="stylesheet" href="*/dtree/dtree.css" type="text/css"/>

2.在JSP中使用：

 <div class="dtree">
						<script type="text/javascript"> 
							d = new dTree('*/*/dtree/','d');//new一个树对象 ,引入图片路径，直到dtree包
							//设置树的节点及其相关属性 
							d.add(0,-1,'栏目树'); 
							<c:forEach var="column" items="${columnList}">
								url="javascript:selectArticleByColumn(${column.id})";
								d.add('${column.id}','0','${column.name}',url);
							</c:forEach>
							//config配置，设置文件夹不能被链接，即有子节点的不能被链接。 
							d.config.folderLinks=false; 
							document.write(d); 
						</script>
					  </div>

3.在dtree/dtree.js中有function dTree(objName){}，直接使用的话，好像图片无法正常加载，所以我修改了下，js中的此方法：

function dTree(path,objName) {

	this.config = {

		target					: null,

		folderLinks			: true,

		useSelection		: true,

		useCookies			: true,

		useLines				: true,

		useIcons				: true,

		useStatusText		: false,

		closeSameLevel	: false,

		inOrder					: false

	}

	this.icon = {

		root				: path+'img/base.gif',

		folder			: path+'img/folder.gif',

		folderOpen	: path+'img/folderopen.gif',

		node				: path+'img/page.gif',

		empty				: path+'img/empty.gif',

		line				: path+'img/line.gif',

		join				: path+'img/join.gif',

		joinBottom	: path+'img/joinbottom.gif',

		plus				: path+'img/plus.gif',

		plusBottom	: path+'img/plusbottom.gif',

		minus				: path+'img/minus.gif',

		minusBottom	: path+'img/minusbottom.gif',

		nlPlus			: path+'img/nolines_plus.gif',

		nlMinus			: path+'img/nolines_minus.gif'

	};

	this.obj = objName;

	this.aNodes = [];

	this.aIndent = [];

	this.root = new Node(-1);

	this.selectedNode = null;

	this.selectedFound = false;

	this.completed = false;

};

更改了之后，才好使！

tree.add()中参数详解：

/*   
    tree.add(id,pid,name,url,title,target,icon,iconOpen,other,open);
    1:id        ：节点自身的id
    2:pid       ：节点的父节点的id
    3:name      ：节点显示在页面上的名称
    4:url       ：节点的链接地址
    5:title     ：鼠标放在节点上所出现的提示信息
    6:target    ：节点链接所打开的目标frame（如框架目标mainFrame或是_blank, _self之类）
    7:icon      ：节点关闭时的显示图片的路径
    8:iconOpen  ：节点打开时的显示图片的路径
    9:other     ：
    10:open     ：布尔型，节点是否展开（默认为false）
    ------------------------------------------------
*/