二级联动基本代码
function createXMLHttpRequest() { if (window.ActiveXObject) { xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); } else if (window.XMLHttpRequest) { xmlHttp = new XMLHttpRequest(); } } // 删除城市选项 function clearCityList(){ var citys = document.getElementById("city"); while(citys.childNodes.length > 0){ citys.removeChild(citys.childNodes); } } //选项省份时 function selectProvince(){ var province = document.getElementById("province").value;//获取省份值 if(province == ""){ //如果为空,则清空城市选项 clearCityList(); var citySelect = document.getElementById("city"); //获取城市select组件 var option = document.createElement("option"); option.appendChild(document.createTextNode("请选择城市")); citySelect.appendChild(option); return ; //返回 } //服务器处理地址,是一个Servlet var url = encodeURI("ajax.portal?action=autoUpdate&province=" + province); url = encodeURI(url); createXMLHttpRequest();//创建xmlHttp对象; xmlHttp.onreadystatechange = handleStateChange; //回调函数 xmlHttp.open("GET",url,true); xmlHttp.send(null); } //回调函数 function handleStateChange(){ if(xmlHttp.readyState == 4){ if(xmlHttp.status == 200){ updateCitysList(); } } } //页面更新城市集合函数 function updateCitysList(){ clearCityList();//首先删除先前的城市选项 var citySelect = document.getElementById("city"); //获取城市select组件 var results = xmlHttp.responseXML.getElementsByTagName("city");//获取Ajax返回的结果,city为返回的XML里的节点 var option = null; for(var i=0; i<results.length; i++){ option = document.createElement("option"); option.appendChild(document.createTextNode(results.firstChild.nodeValue)); citySelect.appendChild(option); } } <logic:present name="provinces" scope="request"> <html:select property="province" styleId="province" onchange="selectProvince();"> <html:option value="">请选择省份</html:option> <html:options name="provinces" labelName="provinces" /> </html:select> <html:select property="city" styleId="city" style="width:90px"> <html:option value="">请选择城市</html:option> </html:select> </logic:present>if("autoUpdate".equals(form.getAction())){response.setContentType("text/xml; charset=UTF-8");//xml response.setHeader("Cache-Control","no-cache");//HTTP1.1 response.setHeader("Pragma","no-cache");//HTTP1.0 response.setDateHeader("Expires",0); PrintWriter out=null; String name = request.getParameter("province"); try {out = response.getWriter();//name = new String(name.getBytes("ISO8859-1"), "UTF-8"); name=java.net.URLDecoder.decode(name,"UTF-8");} catch (IOException e) {// TODO Auto-generated catch blocke.printStackTrace();} System.out.println("name="+name); Dom4jUtil dom=new Dom4jUtil();String fileName=getRealPath()+File.separator+"src"+File.separator+"city.xml";System.out.println("fileName="+fileName);dom.parse(fileName);StringBuffer sb = new StringBuffer("<citys>");List citys = dom.getChildList();//获取城市System.out.println("citys.size="+citys.size());for(int i=0;i<citys.size();i++){KeyValue city=(KeyValue)citys.get(i);//System.out.println("city.getKey()="+city.getKey());if(city.getKey().equals(name)){sb.append("<city>"); sb.append(city.getValue()); sb.append("</city>");}}sb.append("</citys>"); System.out.println("sb.toString="+sb.toString()); out.print(sb.toString()); out.flush(); out.close(); }
页:
[1]