浏览 1774 次
|
锁定老帖子 主题：异步入门小程序
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
|
|
|---|---|
| 作者 | 正文 |
|
发表时间：2007-12-11
重新做个省市关联的小程序，修正一下思路，自己参看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[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>
声明：ITeye文章版权属于作者，受法律保护。没有作者书面许可不得转载。
推荐链接
|
| 返回顶楼 | |
