利用DTree来制作js树
整体思路就是利用java方法取出树节点对象的数组，将其传给js端，利用DTree来生成树。
DTree网址： http://destroydrop.com/javascripts/tree/
jsp页面
具体的二次开发可参考 http://programmerdigest.cn/2009/12/607.html
补充：一般我们在用Js树时都会需要checkbox，这时需要添加部分代码（见附件），至于取出选中的节点数组，可以在点击checkbox动作后进行一次遍历，选出被选的节点标识，组成一个字符串，把它赋给同页面中的隐藏文本框，这样就能取出来了。
DTree网址： http://destroydrop.com/javascripts/tree/
//节点对象类
public class BookMo {
private int bookId;
private String bookName;
private int bookTId;
BookMo(int id, String name, int bookTId) {
this.bookId = id;
this.bookName = name;
this.bookTId = bookTId;
}
public int getBookId() {
return bookId;
}
public void setBookId(int bookId) {
this.bookId = bookId;
}
public String getBookName() {
return bookName;
}
public void setBookName(String bookName) {
this.bookName = bookName;
}
public float getBookTId() {
return bookTId;
}
public void setBookPrice(int bookTId) {
this.bookTId = bookTId;
}
}
//给节点赋值和位置ID，生成对应的js代码
import java.util.ArrayList;
import java.util.Iterator;
import java.util.List;
public class BookDb {
private static List<BookMo> treeList;
static {
treeList = new ArrayList<BookMo>();
//第三个参数是父节点ID
BookMo bm = new BookMo(1, "book", -1);
treeList.add(bm);
bm = new BookMo(2, "computer book", 1);
treeList.add(bm);
bm = new BookMo(3, "other book", 1);
treeList.add(bm);
bm = new BookMo(4, "thinking in java", 2);
treeList.add(bm);
bm = new BookMo(5, "core java", 2);
treeList.add(bm);
bm = new BookMo(6, "effective java", 2);
treeList.add(bm);
bm = new BookMo(7, "GOF", 2);
treeList.add(bm);
bm = new BookMo(8, "明朝那些事儿", 3);
treeList.add(bm);
bm = new BookMo(9, "疯狂的程序员", 3);
treeList.add(bm);
bm = new BookMo(10, "圈子圈套", 3);
treeList.add(bm);
}
public List<BookMo> getBookNodes() {
return treeList;
}
// 返回定义且生成页面树的 js 字符串
public String getJSTreeString(){
Iterator<BookMo> treeIt = getBookNodes().iterator();
StringBuffer sbf = new StringBuffer();
// 定义js树对象
sbf.append("dtree = new dTree(\"dtree\");");
while(treeIt.hasNext()){
BookMo nd = treeIt.next();
// 增加 js树结点，可以指定点击的调用方法
sbf.append("dtree.add("+nd.getBookId()+","+nd.getBookTId()+",\""+nd.getBookName()+"\",\"javascript: void(0);\");");
}
// 输出js树
sbf.append("document.write(dtree);");
return sbf.toString();
}
}
jsp页面
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@page import="com.LY.dtree.BookDb"%><html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Show Tree</title>
<link rel="StyleSheet" type="text/css" href="dtree.css" />
<script type="text/javascript" src="dtree.js"></script>
</head>
<body>
<script type="text/javascript">
eval('<%=new BookDb().getJSTreeString()%>');
</script>
</body>
</html>
具体的二次开发可参考 http://programmerdigest.cn/2009/12/607.html
补充：一般我们在用Js树时都会需要checkbox，这时需要添加部分代码（见附件），至于取出选中的节点数组，可以在点击checkbox动作后进行一次遍历，选出被选的节点标识，组成一个字符串，把它赋给同页面中的隐藏文本框，这样就能取出来了。