异步入门小程序
重新做个省市关联的小程序,修正一下思路,自己参看JS的DOC和DOM的DOC做出的东东。<%@ page contentType="text/html;charset=UTF-8"%><%@ include file="/WEB-INF/pages/common/taglibs.jsp"%><html><head><title>某个地区内所管辖的城市列表</title><meta http-equiv="pragma" content="no-cache"><meta http-equiv="cache-control" content="no-cache"><meta http-equiv="expires" content="0"><meta http-equiv="description" content="某个地区内所管辖的城市列表"><script type="text/javascript">var xmlHttprequest;//发送请求function getCityList(){ document.myForm.cityId.options.length=0; var option=new Option("读取中...",0,false,false); document.myForm.cityId.options=option;var url="/gd/subcenter!getCityList.action?provinceId="+document.getElementById("provinceId").value;//alert(url); if(window.ActiveXObject){ xmlHttprequest = new ActiveXObject("Microsoft.XMLHTTP"); //xmlHttprequest.setRequestHeader('Content-Type','text/xml;charset=UTF-8'); xmlHttprequest.onreadystatechange=parseXML; }else if (window.XMLHttpRequest){ xmlHttprequest = new XMLHttpRequest(); if (xmlHttprequest.overrideMimeType) { xmlHttprequest.overrideMimeType('text/xml'); } xmlHttprequest.onreadystatechange=parseXML; } xmlHttprequest.open("post",url,true); xmlHttprequest.send();}//解析DOMfunction parseXML(){//alert("ok1"); if (xmlHttprequest.readyState == 4) { if (xmlHttprequest.status == 200) { //alert("ok"); var doc = (xmlHttprequest.responseXML); var node=doc.documentElement.firstChild; //alert(node+"asdf"); var i=1; //先清空 document.myForm.cityId.options.length=0; var option=new Option("-----",0,false,false); document.myForm.cityId.options=option; while(node!=null) { var value=node.attributes.item(0).value; var text=node.attributes.item(1).value; var option=new Option(text,value,false,false); document.myForm.cityId.options=option; node=node.nextSibling; i++; } } else { } }}</script></head><body><form name="myForm" action="" method="post"><select name="provinceId" size="1"onchange="javascript:getCityList();"><option value="0" selected>------</option><c:forEach var="province" items="${serverItem.provinceList }"varStatus="status"><option value="${province.id }">${province.name }</option></c:forEach></select><select name="cityId" size="1"><option value="0" selected>------</option><c:forEach var="city" items="${serverItem.cityList }"varStatus="status"><option value="${city.id }">${city.name }</option></c:forEach></select></form></body></html>
页:
[1]