公司最近的项目需要用到树形下拉框，在网上找了挺多源码，最后还是采用了zTree来实现，因为代码的移植性比较高，而且数据的获取比较容易。废话不多说，直接上代码。
index.jsp
复制代码 代码如下:
<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<html>
<head>
<link rel="stylesheet" href="<c:url value='/js/ztree/css/demo.css'/>" type="text/css"></link>
<link rel="stylesheet" href="<c:url value='/js/ztree/css/zTreeStyle/zTreeStyle.css'/>" type="text/css"></link>
<script type="text/javascript" src="<c:url value='/js/ztree/js/jquery-1.4.4.min.js'/>"></script>
<script type="text/javascript" src="<c:url value='/js/ztree/js/jquery.ztree.core-3.5.js'/>"></script>
<SCRIPT type="text/javascript">
<>
</SCRIPT>
</head>
<body>
<div>
<ul>
<li> <span>选择城市时，按下 Ctrl 或 Cmd 键可以进行多选</span></li>
<li> 城市：<input id="citySel" type="text" readonly value=""/>
<a id="menuBtn" href="#">选择</a></li>
</ul>
</div>
<div id="menuContent">
<ul id="treeDemo"></ul>
</div>
</body>
</html>
spring后台
json数据类
复制代码 代码如下:
public class EquipTypeJson {
private String id;
private String pId;
private String name;
public String getId() {
return id;
}
public void setId(String id) {
this.id = id;
}
public String getPId() {
return pId;
}
public void setPId(String pId) {
this.pId = pId;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
}
controller页面
复制代码 代码如下:
public ModelAndView List(HttpServletRequest request, HttpServletResponse response,Product prod) throws Exception {
Map map=new HashMap();
List<EquipTypeJson> list = testService.getAllEquipType();//数据库中获取源数据
JSONArray jsonArray = JSONArray.fromObject(list); //将list数据转为json对象
String json = jsonArray.toString(); //将json对象转为字符串
map.put("jsonList", json);
return new ModelAndView("equip/List").addAllObjects(map);
}
【jquery ztree实现下拉树形框使用到了json数据】相关文章：
★ jquery实现点击label的同时触发文本框点击事件的方法
★ jquery插件splitScren实现页面分屏切换模板特效