重新做个省市关联的小程序，修正一下思路，自己参看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>
分享到：
相关推荐
【小程序开发入门】 小程序开发是近年来非常热门的技术领域，它主要涉及到移动互联网应用的轻量化设计，让开发者能够快速构建可以在微信、支付宝等平台上运行的应用。以下是一些关于小程序开发的基础知识： 1. **...
本篇将深入探讨“socket套接字编程之tcp小入门小程序”，主要针对使用VC++进行TCP服务器与客户端的控制台编程。我们将讨论TCP协议的基础知识，以及如何在VC++环境中构建简单的TCP服务器和客户端应用。 TCP...
以上就是微信小程序入门所需掌握的主要知识点。通过学习和实践，你可以逐步构建出功能完善的微信小程序，满足用户的多样化需求。在开发过程中，不断查阅官方文档、参考示例代码和社区经验，将有助于你更快地提升技能...
5. 网络请求：学习如何通过小程序的网络API进行异步数据请求。 通过实践这个入门级天气预报小程序，新手不仅可以掌握小程序开发的基础，还能锻炼解决问题和调试代码的能力，为后续更复杂的项目打下坚实的基础。
"50个单片机入门小程序"集合了适合新手学习的源代码实例，旨在帮助初学者快速掌握单片机的基本操作和编程技巧。下面将详细讲解这些知识点。 1. **基础概念** - **单片机**：单片微型计算机，简称单片机，是将微...
本资源“C#入门基础练习小程序集合”提供了一组实践性的学习材料，旨在帮助初学者更好地理解和掌握C#的基础概念。 1. **变量与数据类型**：在C#中，变量是存储数据的容器，而数据类型决定了变量可以存储的值的类型...
开发者需要理解HTTP/HTTPS协议，掌握Ajax异步请求，熟悉数据绑定和状态管理，如微信小程序中的`setData`方法，以及事件处理等。 该项目的特点是“下载即用”，这意味着它包含了一个完整的微信小程序应用的所有组成...
本《微信小程序开发手册（完整版）.CHM》是专为初学者和进阶开发者设计的指导性资料，涵盖了从入门到精通的全过程。 该手册首先会介绍微信小程序的开发环境搭建，包括安装微信开发者工具，设置项目，理解小程序的...
旨在简化小程序开发管理流程，降低开发门槛，提高开发效率。 API文档 中文API文档 主要特性 针对已有的小程序原生API进行简单二次封装，支持更多对原生API的简洁调用方式及链式调用方式。 托管小程序页面JS处理...
8. **微信小程序框架**：微信小程序使用了基于Promise的异步编程模型，以及虚拟DOM来优化性能。开发者需要理解如何有效利用这些特性优化用户体验。 9. **发布与更新**：完成小程序开发后，可以使用微信开发者工具...
首先，微信小程序的开发环境搭建是入门的第一步。开发者需要下载并安装微信开发者工具，这是一个集成了编译、调试、预览功能的综合平台。通过这个工具，我们可以编写、测试和发布微信小程序。 其次，了解小程序的...
以下是对微信小程序入门知识的详细说明： 1. **小程序开发工具**：开发者需要从官方地址（https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html）下载并安装微信开发者工具，这是开发小程序的...
微信小程序是中国腾讯公司推出的一种轻量级应用开发平台，它允许开发者通过一套特定的开发工具和框架，构建出能在微信内部运行的小程序。...对于想要入门微信小程序开发的新人来说，这是一个不可多得的学习资源。
微信小程序是一种轻量级的应用开发平台，由腾讯公司推出，主要应用于移动端，为用户提供便捷的服务体验。本项目是一个基于微信小程序...对于想要入门前端开发特别是微信小程序开发的人来说，这是一个很好的实践案例。
微信小程序入门Demo——记账系统源码的后端部分，是一个非常适合初学者和有志于构建个人记账应用的人群的项目。这个项目基于MongoDB和Express框架，提供了基础的家庭理财管理功能，可以帮助用户轻松记录收支，实现...
【装修带预约小程序（优化版）】是一款专为装修行业设计的微信小程序，它整合了预约服务、案例...无论是对于想要入门微信小程序开发的新手，还是寻求提升和优化已有小程序的开发者，这份源代码都是一份宝贵的参考资料。
《小程序开发：从入门到精通——以DmsMiniPro为例》 在当今移动互联网时代，小程序作为轻量级的应用形态，已经成为开发者和企业的重要选择。本文将以“小程序demo经典版”为例，深入探讨小程序的开发流程、核心功能...
【音乐播放器-小程序+springboot后台】是一个综合性的项目，它涵盖了移动应用开发和后端服务构建的关键技术。此项目结合了微信小程序作为前端用户界面，与基于Java的Spring Boot框架搭建的后端服务器进行数据交互。...
微信小程序是中国腾讯公司旗下微信平台推出的一种轻量级的应用开发框架，它允许开发者在微信内创建功能丰富的原生体验的应用程序，无需安装即可使用。官方提供的DEMO是学习和理解微信小程序开发的重要资源，它包含了...
9. **异步编程**：async/await关键字是C#异步编程的核心，小程序可能会演示如何使用它们实现非阻塞操作，如网络请求或长时间运行的任务。 10. **泛型**：泛型允许创建可重用的组件，对多种数据类型进行操作。小程序...