Ajax实现省市级联

SSM框架，Ajax实现页面功能

JSP部分

  

<script type="text/javascript">
  	$(function(){
  		queryProvince();
  		$("#provinceid").change(function(){
  			var provinceid=$(this).val();
  			$("#cityid").empty();
  			$("#areaid").empty();
  			queryCity(provinceid);
  		});
  		$("#cityid").change(function(){
  			var cityid=$(this).val();
  			$("#areaid").empty();
  			queryArea(cityid);
  		});
  		
  		function queryArea(cityid){
  			$.ajax({
  				type:"post",
  				url:"userinfo/queryArea.do",
  				data:{"cityid":cityid},
  				success:function(result){
  					$("#areaid").append("<option value=''>请选择</option>");
  					$.each(result,function(i,items){
  						$("#areaid").append("<option value='"+items.areaid+"'>"+items.area+"</option>");
  					});
  				}
  			});
  		}
  		
  		function queryCity(provinceid){
  			$.ajax({
  				type:"post",
  				url:"userinfo/queryCity.do",
  				data:{"provinceid":provinceid},
  				success:function(result){
  					$("#cityid").append("<option value=''>请选择</option>");
  					$.each(result,function(i,items){
  						$("#cityid").append("<option value='"+items.cityid+"'>"+items.city+"</option>");
  					});
  				}
  			});
  		}
  		
  		function queryProvince(){
  			$.ajax({
  				type:"post",
  				url:"userinfo/queryProvince.do",
  				success:function(result){
  					$("#provinceid").append("<option value=''>请选择</option>");
  					$.each(result,function(i,items){
  						$("#provinceid").append("<option value='"+items.provinceid+"'>"+items.province+"</option>");
  					});
  				}
  			});
  		}
  		
  	});
  </script>

Controller部分

在市、县/区的查询中，传递的值为String类型

	/**
	 * 省份查询
	 * @return
	 */
	@RequestMapping("queryProvince")
	@ResponseBody
	public List<Province> queryProvince(){
		List<Province> list=userInfoService.queryProvince();
		return list;
	}
	
	/**
	 * 市查询
	 * @param provinceid
	 * @return
	 */
	@RequestMapping("queryCity")
	@ResponseBody
	public List<City> queryCity(String provinceid){
		List<City> list=userInfoService.queryCity(provinceid);
		return list;
	}
	
	/**
	 * 县/区查询
	 * @param cityid
	 * @return
	 */
	@RequestMapping("queryArea")
	@ResponseBody
	public List<Area> queryArea(String cityid){
		List<Area> list=userInfoService.queryArea(cityid);
		return list;
	}
	

	<select id="queryArea" parameterType="String" resultType="Area">
		select * from area where father=#{cityid}
	</select>

在市、县/区的查询中，传递的值为String类型