怎么用java代碼實現上面這樣的目錄樹?
首先創建數據表
每條數據記錄自己的id以及父節點的id
然后進入java代碼部分:
public String directory(String author) { StringBuffer treeHtml = new StringBuffer(); // 得到所有的目錄詞(包含全部字段) List<Tutorial> words = bdExpandService.getAllWords(author); for (int i = 0; i < words.size(); i++) { Tutorial wordMap = words.get(i); // System.out.println(wordMap); if (wordMap.getPid() == 0) { treeHtml.append("<dl>"); // 得到根目錄的id,根據這個id找到這個的所有子目錄 appendTree(words, wordMap, treeHtml); treeHtml.append("</dl>"); } } words.clear(); return treeHtml.toString(); } /** * * 構造目錄樹 <功能詳細描述> * * @param tutorials * @param tutorial * @param treeHtml * @see [類、類#方法、類#成員] */ private void appendTree(List<Tutorial> words, Tutorial wordMap, StringBuffer treeHtml) { int tid = wordMap.getTid(); // 得到根目錄的id,根據這個id找到這個的所有子目錄 Map<String, Object> map = childTreeHtml(words, tid); String nodeHtml = map.get("treeHtml").toString(); boolean hasChild = Boolean.valueOf(map.get("hasChild").toString()); if (hasChild) { treeHtml.append("<dt class='node-close' onclick='showTree(").append(tid).append(")'"); treeHtml.append("id='tree_dt").append(tid).append("'>"); treeHtml.append(wordMap.getKeyWord()).append("</dt>"); treeHtml.append(nodeHtml); } else { treeHtml.append("<dt>"); treeHtml.append(wordMap.getKeyWord()).append("</dt>"); } } /** * * 得到子目錄,構造目錄樹 <功能詳細描述> * * @param tutorials * @param tid * @return * @see [類、類#方法、類#成員] */ private Map<String, Object> childTreeHtml(List<Tutorial> words, int tid) { Map<String, Object> map = new HashMap<String, Object>(); StringBuffer treeHtml = new StringBuffer(); boolean hasChild = false; for (int i = 0; i < words.size(); i++) { Tutorial wordMap = words.get(i); int pid = wordMap.getPid(); if (pid == tid) { hasChild = true; treeHtml.append("<dd name='tree_dd").append(pid).append("'"); treeHtml.append("style='display: none;'>").append("<dl>"); appendTree(words, wordMap, treeHtml); treeHtml.append("</dl></dd>"); } } map.put("treeHtml", treeHtml); map.put("hasChild", hasChild); return map; }
JavaScript方法:
function showTree(tid) { var dds = $("dd[name='tree_dd" + tid + "']"); var dtClass = $("#tree_dt" + tid).attr("class"); if(dtClass == "node-close"){ $("#tree_dt" + tid).attr("class", "node-open"); $("dd[name='tree_dd" + tid + "']").each(function(){ $(this).show(); }); }else{ $("#tree_dt" + tid).attr("class", "node-close"); $("dd[name='tree_dd" + tid + "']").each(function(){ $(this).hide(); }); } }
directory()方法返回的字符串就是整個目錄樹,然后將這個字符串傳到前台頁面顯示,加上css樣式就可以了