结合JSON 支持动态从数据库加载节点,支持鼠标右键菜单,支持checkbox 和radio
把数据加载的节点信息保存在下面的类中:
public class Node { private String text; private String action; private String src; private String icon; private String openIcon; private String target; private int checkboxType; private boolean isChecked; private String value; private String oncontextmenu; public String getText() { return text; } public void setText(String text) { this.text = text; } public String getAction() { return action; } public void setAction(String action) { this.action = action; } public String getSrc() { return src; } public void setSrc(String src) { this.src = src; } public String getIcon() { return icon; } public void setIcon(String icon) { this.icon = icon; } public String getOpenIcon() { return openIcon; } public void setOpenIcon(String openIcon) { this.openIcon = openIcon; } public String getTarget() { return target; } public void setTarget(String target) { this.target = target; } public int getCheckboxType() { return checkboxType; } public void setCheckboxType(int checkboxType) { this.checkboxType = checkboxType; } public boolean getIsChecked() { return isChecked; } public void setIsChecked(boolean isChecked) { this.isChecked = isChecked; } public String getOncontextmenu() { return oncontextmenu; } public void setOncontextmenu(String oncontextmenu) { this.oncontextmenu = oncontextmenu; } public String getValue() { return value; } public void setValue(String value) { this.value = value; } }
src :加载数据库数据URL
action:点击节点上的文字要执行的javascritp事件
text:节点上显示的文字
checkboxType:1=checkbox,2=radio
value : checkbox,radio的值
其他参数根据名字和代码自己研究去例子view.jsp
<%@ page language="java" pageEncoding="UTF-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title></title> <script type="text/javascript" src="/xloadtree/xloadtree/xtree.js"></script> <script type="text/javascript" src="/xloadtree/xloadtree/xmlextras.js"></script> <script type="text/javascript" src="/xloadtree/xloadtree/xloadtree.js"></script> <script type="text/javascript" src="/xloadtree/xloadtree/json_parse.js"></script> <script type="text/javascript" src="/xloadtree/xloadtree/json2.js"></script> </head> <body> <input type="button" value="确定" onclick="doClose()" ><br> <script type="text/javascript"> var tree = new WebFXTree("中国"); tree.add(new WebFXLoadTreeItem("云南","/xloadtree/getData.jsp?id=1","javascript:alert('点击事件')",null,null,null,1,"id-1",true,null)); tree.add(new WebFXLoadTreeItem("广东","/xloadtree/getData.jsp?id=2","javascript:alert('点击事件')",null,null,null,1,"id-2",false,null)); document.write(tree); function doClose(){ var temp=document.getElementsByName("checkbox_id"); for(i=0;i<temp.length;i++){ if(temp[i].checked){ alert(temp[i].value); } } } </script> </body> </html>取数据的getData.jsp
<%@ page language="java" pageEncoding="UTF-8"%> <% java.util.List<com.Node> list= new java.util.ArrayList<com.Node>(); String id=request.getParameter("id"); com.Node node= new com.Node(); if(id.equals("1")){ node.setAction(null); node.setText("昆明"); node.setCheckboxType(1); node.setIsChecked(false); node.setValue("3"); list.add(node); } if(id.equals("2")){ node= new com.Node(); node.setAction(null); node.setText("深圳"); node.setCheckboxType(1); node.setIsChecked(true); node.setValue("4"); list.add(node); } net.sf.json.JSONArray json= net.sf.json.JSONArray.fromObject(list); out.println(json); %>对js的源码修改这里就不在解释了,自己去研究 下载工程