异步入门小程序

重新做个省市关联的小程序,修正一下思路,自己参看JS的DOC和DOM的DOC做出的东东。

[code]
<%@ 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[0]=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();
}
//解析DOM
function 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[0]=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[i]=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>

[/code]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值