AJAX 联动问题

public void init() throws ServletException { List<String> list = new ArrayList<String>(); list.add("遵义"); list.add("仁怀"); list.add("毕节"); list.add("兴义"); list.add("都匀"); map.put("1", list); list = new ArrayList<String>(); list.add("深圳"); list.add("佛山"); list.add("东莞"); list.add("福永"); map.put("2", list); list = new ArrayList<String>(); list.add("成都"); list.add("绵羊"); list.add("舟曲"); list.add("纳丹"); map.put("3", list); }

public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { String shengId = request.getParameter("shengId"); List<String> list = map.get(shengId); StringBuilder sb = new StringBuilder(); if(list!=null){ for(String s : list){ sb.append(s).append(","); } if(!list.isEmpty()) sb.deleteCharAt(sb.length() - 1);//如果不存在后面的地区 就把，删除掉 } response.setContentType("text/html; charset=utf-8"); PrintWriter out = response.getWriter(); out.write(sb.toString()); out.close(); }

var xmlHttpRequest; function createXmlHttpRequest(){ if(window.ActiveXObject){ try{ xmlHttpRequest = new ActiveXObject("Microsoft.XMLHTTP"); }catch(e){ xmlHttpRequest = new ActiveXObject("Msxml2.XMLHTTP"); } return xmlHttpRequest; }else if(window.XMLHttpReuqest){ return new XMLHttpReuqest(); } return xmlHttpRequest; } function sendRequest(shengId){ if(shengId == '0'){ alert('选择默认的项,清空市'); clearCity(); return ; } xmlHttpRequest = createXmlHttpRequest(); xmlHttpRequest.open('POST', "CityConnect?shengId=" + shengId, true); xmlHttpRequest.onreadystatechange = getRequest;//调用回调函数 xmlHttpRequest.setRequestHeader("if-Modified-Since","0"); xmlHttpRequest.send(null); } function getRequest(){ var shi = document.getElementById('shi'); if(xmlHttpRequest.readyState == 4 && xmlHttpRequest.status == 200){ clearCity(); var ss = xmlHttpRequest.responseText; var shis = ss.split(","); for(var i = 0; i<shis.length; i++){ var op = document.createElement("option"); op.text = shis[i]; op.value = i; //shi.appendChild(op);//把op追加到市 option shi.options[i + 1] = op; } } } function clearCity(){ var shi = document.getElementById('shi'); shi.options.length = 0 ; shi.options[0] = new Option('--请选择--','0'); }

<font color="blue"> 请选择您来自那里</font><br> 省：<select id="sheng" onchange="sendRequest(this.value)"> <option value="0"> --请选择--</option> <option value="1"> 贵州省</option> <option value="2"> 广东省</option> <option value="3"> 四川省</option> </select> 市：<select id="shi"> <option value="0"> --请选择--</option> </select>