flash59 发表于 2013-2-6 08:30:38

异步入门小程序

重新做个省市关联的小程序,修正一下思路,自己参看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]
查看完整版本: 异步入门小程序