第五例:省市联动1|学习笔记

简介: 快速学习第五例:省市联动1

开发者学堂课程【Ajax:第五例:省市联动1】学习笔记,与课程紧密联系,让用户快速学习知识。

课程地址:https://developer.aliyun.com/learning/course/31

第五例:省市联动1


省市联动

1、页面

<select name =”province>

<option>===请选择省份===</option>

</select>

<select name=”city>

<option>===请选择城市===</option>

</select>

在页面打开就应该把所有省加载出来。

2、ProvinServlet

●ProvinceServlet:当页面加载完毕之后马上请求这个servlet

>他需要加载china.xml文件,把所有的省的名称使用字符串发送给客户端。

3、页面的工作:

●获取这个字符串,使用逗号分隔,得到数组;

●循环遍历每个字符串(省份名称),使用每个字符串创建一个<option>元素添加到<select name=”province>这个元素中。

4、CityServelt

●CityServlet:当页面选择某个省时,发送请求;

●得到省份名称,加载China.xml文件,查询出该省份对应的元素对象,把这个元素转换成xml字符串,发送给客户端。

5、页面的工作

●把<select name=”ciyt>中的所有子元素删除,但不要删除<option>===请选择城市===</opyion>;

●得到服务器的相应结果:doc;

●获取所有的<city>子元素,循环遍历,得到<city>的内容;

●使每个<city>的内容创建一个<option>元素,添加到<select name=”ciyt>。

image.png

举例:

image.png


相关文章
|
2月前
|
JavaScript 算法 前端开发
vue + echarts实现国省市三级下钻联动
vue + echarts实现国省市三级下钻联动
63 0
|
18天前
|
SQL 存储 前端开发
省市县三级联动的实现方案
省市县三级联动的实现方案
74 0
|
10月前
|
小程序 JavaScript 定位技术
微信小程序实现一键查询全国快递物流地图轨迹
通过本教程,用户可以输入快递单号,点击查询按钮,然后跳转到显示页面,在该页面上展示物流轨迹的地图信息。这个功能可以方便用户了解快递的实时位置和运输轨迹,提升用户体验和便利性。你可以根据实际需求进行扩展和优化,使其更适合你的小程序应用。
231 0
|
Java 程序员 数据库连接
一、《学生教务系统》之城市管理板块实现
《学生教务系统》之城市管理板块实现 🍅 Java学习路线:搬砖工的Java学习路线 🍅 作者:程序员小王 🍅 程序员小王的博客:https://www.wolai.com/wnaghengjie/ahNwvAUPG2Hb1Sy7Z8waaF 🍅 扫描主页左侧二维码,加我微信 一起学习、一起进步 🍅 欢迎点赞 👍 收藏 ⭐留言 📝 🍅 如有编辑错误联系作者,如果有比较好的文章欢迎分享给我,我会取其精华去其糟粕
119 0
一、《学生教务系统》之城市管理板块实现
|
XML 前端开发 数据格式
第五例:省市联动1| 学习笔记
快速学习第五例:省市联动1
|
XML 前端开发 数据格式
第五例:省市联动2| 学习笔记
快速学习第五例:省市联动2
第五例:省市联动2| 学习笔记
|
XML 前端开发 数据格式
第五例:省市联动1|学习笔记
快速学习第五例:省市联动1
第五例:省市联动1|学习笔记
|
XML 前端开发 数据格式
第五例:省市联动2|快速学习
快速学习第五例:省市联动2
第五例:省市联动2|快速学习
|
10月前
|
存储 传感器 开发者
一文搞懂I2C通信总线
I2C(集成电路总线),由Philips公司(2006年迁移到NXP)在1980年代初开发的一种简单、双线双向的同步串行总线,它利用一根时钟线和一根数据线在连接总线的两个器件之间进行信息的传递,为设备之间数据交换提供了一种简单高效的方法。每个连接到总线上的器件都有唯一的地址,任何器件既可以作为主机也可以作为从机,但同一时刻只允许有一个主机。
|
算法 数据挖掘 知识图谱
基于品类关系,虚拟类目如何建设?
类目-属性项-属性值体系(简称CPV)是淘宝建设中非常重要的基石,在商品的发布、管理,以及搜索场景下都大量应用。比如每个商品都有自己的类目、以及属性,而且需要发布在适合自己的类目下,才能够方便管理和搜索;在用户搜索的过程中,对Query的类目预测也是相关性中非常重要的一环。
4903 0