前言：在某些电商网站或者APP中，通常填写地址时，会有这样的功能：当我们选择的省份是“山东”时，则城市的下拉列表里所展示的便是山东的城市，当选择的省份是“山西”时，城市的下拉列表所展示的便是山西的城市，今天，我们就来看看，这样的功能通过java是如何实现的？
先来看看运行效果：
这是一个简单的案例，如果还有别的需求，可以自行扩展。
接下来看看怎么实现？
01
Jsp页面
首先，看运行效果，可得需要三个下拉列表，第一个是省份，第二个是城市，第三个则是景点，三个下拉列表的代码如下：
省份：<select id="sheng">
<option value="请选择">请选择</option>
<option value="山东">山东</option>
<option value="山西">山西</option>
</select>
城市：<select id="shi"></select>
景点：<select id="jing"></select>代码解析：先在省份的下拉列表中初始化了两个省份，山东和山西（此处只举这两个省，别的可以下来自行补充），由于我们并不知道用户会选择哪个省份，所以姑且让其空着，待会儿动态的添加，景点也是一样的道理。
02
Ajax关键代码
当然，该功能使用js也可以实现，只是今天正好看到了ajax，所以就用ajax结合jquery来实现。下面是关键代码：
$("#sheng").change(function(){
//获取当前选中的省份
var sheng = $("#sheng").val();
$.getJSON("AjaxServlet",
"tag=jsonTest&&county="+sheng,
function(data){
$("#shi").html("<option>请选择</option>");
for(var i in data){
$("#shi").append("<option value='"+data[i]+"'>"+data[i]+"</option>");
}
}
);
});当改变省份的下拉列表时，执行后面的操作，初始化城市下拉列表。
public void jsonTest(HttpServletRequest request,HttpServletResponse response) throws IOException{
PrintWriter out = response.getWriter();
String county = request.getParameter("county");
List<String> list = new ArrayList<String>();
if(county.equals("山东")){
list.add("济南");
list.add("德州");
list.add("齐河");
list.add("日照");
list.add("烟台");
list.add("威海");
list.add("青岛");
list.add("聊城");
}else if(county.equals("山西")){
list.add("吕梁");
list.add("太原");
list.add("大同");
list.add("榆次");
list.add("晋城");
list.add("临汾");
list.add("汾阳");
list.add("柳林");
}
String jsonStr = JSON.toJSONString(list);
out.print(jsonStr);
}代码解析：先获取到用户选择的省份，然后通过ajax提交到Servlet中，在Servlet中构建该省份的城市集合，最后转换成json格式的收据传回json页面中，在ajax的回调函数中，将json数据解析添加至城市的下拉列表中。
03
Servlet中的关键代码
根据城市获取景点也是同样的原理，jsp中的关键代码如下：
//当改变城市的下拉列表时
$("#shi").change(function(){
//获取当前选中的是哪个城市
var city = $("#add").val();
$.getJSON(
"AjaxServlet",
"tag=city&&city="+city,
function(data){
$("#jing").html("<option>请选择</option>");
for(var i in data){
$("#jing").append("<option>"+data[i]+"</option>");
}
}
);
});Servlet中的关键代码如下：
//获取景点
public void getJingDian(HttpServletRequest request,HttpServletResponse response) throws IOException{
PrintWriter out = response.getWriter();
//获取城市
String city = request.getParameter("city");
Map<String, String> map = new HashMap<String, String>();
if(city.equals("济南")){
map.put("quan","大明湖");
map.put("qian","千佛山");
map.put("jing","省博物馆");
}else if(city.equals("德州")){
map.put("pa","德州扒鸡");
map.put("pu","德州扑克");
}
String jsonObject = JSON.toJSONString(map);
System.out.println(jsonObject);
out.print(jsonObject);
}往期精彩
点分享
点点赞
点在看