直接上程式碼

前臺：

// 例項化樹選單
		$("#tree").tree({
			url:'../servlet/Nodes_Do?id=0',
			 onBeforeExpand:function(node,param){  
                     $('#tree').tree('options').url = "../servlet/Nodes_Do?id=" + node.id;
                 },  
               loadFilter: function(data){    
                  if (data.msg){    
                      return data.msg;    
                 } else {    
                     return data;    
                 }    
            }, 
			lines : true,
			onClick : function(node) {
				if (node.attributes) {
					openTab(node.text, node.attributes.url);
				}
			}
		});
	});
 

//點選樹節點center獲取URL內容
		function openTab(text, url) {
			if ($("#tabs").tabs('exists', text)) {
				$("#tabs").tabs('select', text);
			} else {
				var content = "<iframe frameborder='0' scrolling='auto' style='width:100%;height:100%' src="
						+ url + "></iframe>";
				$("#tabs").tabs('add', {
					title : text,
					closable : true,
					content : content
				});
			}
		}		
 

後臺servlet：

public void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		response.setContentType("text/html");
		response.setCharacterEncoding("UTF-8");
		PrintWriter out = response.getWriter();
		String theIdString = request.getParameter("id");//父節點id
		//System.out.println(theIdString);
		int id=Integer.parseInt(theIdString);
		List<Tree> list=schoolTree(id);
		//System.out.println(list.get(1));
        String sc="[";
        for(Tree tree:list){
        	sc+="{";
        	List<Tree> l=schoolTree(tree.getId());
        	if(l.size()!=0){
        	  sc+=String.format("\"id\": \"%s\", \"text\": \"%s\", \"state\": \"closed\"", tree.getId() ,tree.getText());
        	}else{
        		sc+=String.format("\"id\": \"%s\", \"text\": \"%s\", \"attributes\":  \"{%s}\" , \"state\": \"\"", tree.getId() ,tree.getText(),tree.getAttributes());
        	}
        	sc+="},";
        }
        sc=sc.substring(0, sc.length() - 1);
        sc+="]";
        JSONObject  jobj = new JSONObject();
		jobj.put("msg",sc);
		response.getWriter().write(jobj.toString());
		//System.out.println(jobj.toString());
	}
    public List<Tree> schoolTree(int id){
    	Tree t = new Tree();
    	t.setId(id);
    	return t.SchoolTree(t);
    }
	public void doGet(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		this.doPost(request, response);
	}
 

其他類：

public class Tree {
	private int id;
	private int pid;
	private String text;
	private String attributes;
   public int getId() {
		return id;
	}
	public void setId(int id) {
		this.id = id;
	}
	public int getPid() {
		return pid;
	}
	public void setPid(int pid) {
		this.pid = pid;
	}
	public String getText() {
		return text;
	}
	public void setText(String text) {
		this.text = text;
	}
	public String getAttributes(){
		return attributes;
	}
	public void setAttributes(String attributes){
		this.attributes = attributes;
	}
	public List<Tree> SchoolTree(Tree tree) {
		List<Tree> list = null;
		Connection conn = null;
		PreparedStatement ps = null;
		ResultSet rs = null; 
		String sql = ""; 
		
			try {
				list = new ArrayList<Tree>();
				conn = DBConnection.getConnection();
				sql = "SELECT id,pid,text,attributes FROM tree where pid= "+tree.getId();
				sql.toUpperCase();
				ps = conn.prepareStatement(sql);
				rs = ps.executeQuery();
				Tree s = null;
				while (rs.next()) {
					s = new Tree();
					s.setId(rs.getInt("id"));
					s.setPid(rs.getInt("pid"));
					s.setText(rs.getString("text"));
					s.setAttributes(rs.getString("attributes"));
					list.add(s);
				}
			} catch (SQLException e) {
				e.printStackTrace();
			}finally {
			DBConnection.close(rs, ps, conn);
			} 
		return list;
	}
}

資料表簡單設計：

簡單說明一下，在資料庫中存4個值：id,pid,text,attributes,id是主鍵，pid代表父節點的位置編號，text是樹節點的名字，和前臺樹節點屬性對應，attributes存放樹節點指定的url，這個也是和前臺樹節點屬性對應的。

前臺先傳了一個id=0代表根節點，後臺根據傳過來的這個值來查詢這個根節點的孩子，即2、3兩條，放到list裡，for迴圈中指定 了獲得資料庫記錄後的輸出格式——json的形式，並有個判斷，如果沒有孩子節點了，樹節點圖示就以檔案的形式展現，如果還有孩子，則以資料夾的形式展現。

最後效果：

點選節點右側會彈出頁面。

整個專案的下載地址：