前言：在某些電商網站或者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);}

往期精彩

PPT大賽一等獎頒獎

2020-12-08

PPT大賽二等獎頒獎

2020-12-08

PPT大賽三等獎頒獎

2020-12-08

今天你們表現的真棒！！！

2020-12-07

學生一天的生活狀態縮影

2020-12-06

我們漫長的人生旅途中，態度永遠決定一切！！！

2020-12-05

讓優秀成為一種習慣！

2020-12-04

點分享

點點贊

點在看

總結

以上是生活随笔為你收集整理的如何实现省市关联的下拉列表的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。