如果下面没有帮助到你请链接：http://blog.csdn.net/xuanzhangran/article/details/55049198
查询的实现的效果如下：
（1）：点击选择省份，弹出省份列表。
（2）：点击内蒙古，第二个联动默认为呼和浩特，同样点击呼和浩特，下边出现所有的内蒙的城市，同样：当点击任意一个市，区域就会联动出来。此处略。
(3):查询完毕后：页面依然有查询的条件。
前台：
<script src="<%=basePath%>js/business/suRegionAddress.js" type="text/javascript">//引入js
</script>
<script type="text/javascript">
window.onload=function(){
//所在区域联动列表
setup();//下面有加载的js代码
}
</script>
<div class="row">
<span>收货地址:</span>
<select style="WIDTH: 90px;height:30px;" id="province" name="provice" >
<option>选择省份</option>
<c:forEach items="${provinceList}" var="province">
<c:if test="${province.name == proviceName }">
<option value="${province.id}" selected="selected">${province.name}</option>
</c:if>
<c:if test="${province.name != provinceName}">
<option value="${province.id}">${province.name}</option>
</c:if>
</c:forEach>
</select>
<select style="WIDTH: 90px;height:30px;" id="city" name="city" >
<c:if test="${not empty cityName}">
<option value="${cityName}">${cityName}</option>
</c:if>
<c:if test="${empty cityName}">
<option value="">选择城市</option>
</c:if>
</select>
<select style="WIDTH: 90px;height:30px;" id="city" name="city" >
<c:if test="${not empty districtName}">
<option value="${districtName}">${districtName}</option>
</c:if>
<c:if test="${empty districtName}">
<option value="">选择区域</option>
</c:if>
</select>后台：
@RequestMapping("/userList.html")
public String businessFpData(Model model, HttpServletRequest request,
@RequestParam(value = "provice", required = false) String proviceName,
@RequestParam(value = "city", required = false) String cityName,
@RequestParam(value = "city", required = false) String districtName,
@RequestParam(value="pageNo",defaultValue="1")Integer pageNo) {
Map<String, Object> map = new HashMap<String, Object>();
if(StringUtils.isBlank(proviceName) || proviceName.equals("选择省份")){
proviceName = null;
}else{
SuRegion provice =(SuRegion)regionServer.selectByPrimaryKey(Long.parseLong(proviceName));
proviceName = provice.getName();
}
if(StringUtils.isBlank(cityName)|| cityName.equals("选择城市")){
cityName = null;
}else{
if(isNumeric(cityName)){//是数字
SuRegion city =(SuRegion)regionServer.selectByPrimaryKey(Long.parseLong(cityName));
cityName = city.getName();
}
}
if(StringUtils.isBlank(districtName)|| districtName.equals("选择城市")){
districtName = null;
}else{
if(isNumeric(districtName)){//是数字
SuRegion district =(SuRegion)regionServer.selectByPrimaryKey(Long.parseLong(districtName));
districtName = district.getName();
}
}
map.put("proviceName", proviceName);
map.put("cityName", cityName);
map.put("districtName", districtName);
List<SuUser> list = userService.userList(map);//查询
//查询之后查询条件返回保存到页面
model.addAttribute("proviceName", proviceName);
model.addAttribute("cityName", cityName);
model.addAttribute("districtName", districtName);
//加载进入页面的时候将所有的省份查出来：方法在下边的mapping里
model.addAttribute("provinceList", regionServer.getAllProvices());// 获取省份列
}
//根据选中的省份或者城市联动
/**
* 根据省份id获取城市数据后直接使用@ResponseBody装成json数据
*
* @param id
* 省份ID
* @param response
* @return
* @return
*/
@RequestMapping("/getCityByProvinceId.html")
@ResponseBody
public String getCityByProvinceId(
@RequestParam(value = "id", required = false) Long id) {
List<SuRegion> cityList = suRegionServer.getAllCitys(id);
return JSON.toJSONString(cityList);
}
/**
* 根据城市id获取区域数据后直接使用@ResponseBody装成json数据
*
* @param id
* @return
*/
@RequestMapping("/getAreaByCityId.html")
@ResponseBody
public String getAreaByCityId(
@RequestParam(value = "id", required = false) Long id) {
List<SuRegion> areaList = suRegionServer.getAllAreas(id);
return JSON.toJSONString(areaList);
}js代码：suRegionAddress.js
/***
* 省市区三级联动：
* 三个下拉列表id分别是：province、city、area
* @returns
*/
function setup() {
//获取城市
$("#province").click(function () {
$.ajax({
url: "/business/getCityByProvinceId.html?id="+$("#province").val(),
type: "POST",
dataType:'json',
success:function(data){
$("#city").empty(); //清空下拉列表
$.each(data,function(i,item){
$("#city").append(" <option value='" + item.id + "'>" + item.name + "</option>");
});
}
});
});
//获取区县
$("#city").click(function () {
$.ajax({
url: "/business/getAreaByCityId.html?id="+$("#city").val(),
type: "POST",
dataType:'json',
success:function(data){
$("#area").empty(); //清空下拉列表
$.each(data,function(i,item){
$("#area").append(" <option value='" + item.id + "'>" + item.name + "</option>");
});
}
});
});
}mapping的sql语句
<!-- 获取省份列表 -->
<select id="getAllProvices" resultMap="BaseResultMap" parameterType="com.idorabox.entity.SuRegion">
select
<include refid="Base_Column_List" />
from tbl_su_region
where grade = 1
</select>
<select id="getAllCitys" resultMap="BaseResultMap" parameterType="com.idorabox.entity.SuRegion">
select
<include refid="Base_Column_List" />
from tbl_su_region
where grade = 2
<if test="id != null">
and parent = #{id,jdbcType=BIGINT}
</if>
</select>
<!--获取 区县列表 -->
<select id="getAllAreas" resultMap="BaseResultMap" parameterType="com.idorabox.entity.SuRegion">
select
<include refid="Base_Column_List" />
from tbl_su_region
where grade = 3
<if test="id != null">
and parent = #{id,jdbcType=BIGINT}
</if>
</select>