【新生入学】--JS省市二级联动下拉框

最新推荐文章于 2020-09-12 22:38:35 发布
最新推荐文章于 2020-09-12 22:38:35 发布
阅读量4.8k 收藏 3
点赞数 4
分类专栏： -------【JavaScript】 -------【GUAI】 ●编程语言 ●项目实战
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/xdd19910505/article/details/42297519
版权
本文介绍了新生入学个人信息录入时，为规范地址信息，采用JS实现省市二级联动下拉框的方法。通过JavaScript和HTML，结合数组存储省市数据，实现选择省份后自动更新城市下拉框，简化用户输入并确保数据标准化。
摘要由CSDN通过智能技术生成
               

         在新生入学过程中，会添加自己的个人信息，如生源地或者家庭住址等。像这样的信息如果让学生自己输入可能会出现不规范的现象，我们做统计的时候很不方便，所以设计成下拉框选择的形式，这样存进数据库中的数据就都是规范的了。

          籍贯的选择涉及到我们全国的34个省市等，而且选择了每个省之后要相应的知道这个省的市到县，这就用到了下拉框的联动。以前在ASP.NET中是用过的，当时是两个控件的联动从数据库中直接查数据，在JS中也是同样的道理。

          联动效果如下图：


           接着说说代码，用到了JavaScript和

最低0.47元/天 解锁文章
许小乖
关注
专栏目录
js省市二级联动
闲时不练功，忙时一场空
01-01 419
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>js省市二级联动</title> </head> <body> <div style="text-align: center"&...
省份和城市数组 下拉列表
ExceptionofMine的专栏
01-02 5264
//省份和城市数组 var where = new Array(36); function comefrom(loca, locacity) { this.loca = loca; this.locacity = locacity; } where[0] = new comefrom("请选择省份名", "请选择城市名"); where[1] = new comefrom("北京", "|
JS 省市二级联动
ganlangreen的专栏
09-18 124
//定义 城市 数据数组 cityArray = new Array(); cityArray[0] = new Array("请选择","请选择"); cityArray[1] = new Array("北京市","东城|西城|崇文|宣武|朝阳|丰台|石景山|海淀|门头沟|房山|通州|顺义|昌平|大兴|平谷|怀柔|密云|延庆"); ...
用JS实现省市二级联动
weixin_34138255的博客
04-08 174
一、需求分析 我们希望在注册页面中添加一个字段(籍贯)，当用户选择一个具体的省份，在后面的下拉列表中动态加载该省份下所有的城市。显示的效果如下： 二、技术分析 使用事件(onchange) 使用一个二维数组来存储省份和城市 获取用户选择的省份(使用方法传参的方式：this.value) 遍历数组(获取省份与用户选择的省份比较，如果相同了，...
js 省市 二级联动
kuteng
10-03 1105
function __ProvinceAndCityClass(slcProvince,slcCity,initProvince,initCity) { this.selectProvince = slcProvince; this.selectCity = slcCity; if(typeof(initProvince) == 'undefined') var i
layui-省市县三级联动下拉框-HTML源码
最新发布
10-02
本文将详细介绍如何使用HTML、JavaScript（通常配合jQuery）以及可能涉及的CSS来实现"layui-省市县三级联动下拉框"的功能，并探讨其可扩展性。 首先，`layui`是一个流行的前端UI框架，它提供了一套美观、响应式的...
js实现下拉框二级联动
10-17
下拉框二级联动技术是一种在网页上常用的交互方式，它可以根据用户在一级下拉框中的选择动态改变二级下拉框中的选项内容。本文详细介绍了如何使用JavaScript实现下拉框二级联动功能，提供了具体的代码实现以及相关...
javascript实现省市区三级联动下拉框菜单
10-23
本文将详细介绍如何使用JavaScript实现省市区三级联动下拉框菜单，实现过程中需要使用HTML构建静态页面，运用JavaScript进行动态的数据联动操作，并通过geo.js文件实现数据的调用和联动逻辑。 ### HTML页面结构 ...
js实现的下拉框二级联动效果
10-22
本文主要介绍了使用JavaScript实现下拉框二级联动效果的方法，该技术在网页交互设计中非常常见，能够提高用户的操作体验。下拉框二级联动指在一个下拉框中选择了某个选项后，第二个下拉框中的选项会根据第一个下拉框...
省市下拉框二级联动完成版（调试通过）
09-22
### 知识点：省市下拉框二级联动完成版（调试通过） #### 一、概述 在Web开发中，为了提供更好的用户体验与交互性，常常需要实现省市等地理位置的二级联动选择功能。所谓的“二级联动”指的是用户在选择了某个地区...
省市二级联动js
08-28
详细的省市二级联动。数据直接定义在js里面的数组里面
JS省市区联动代码
08-10
JS 实现 省市区 三级联动的数组 返回
js 省市二级联动
爱喝柠檬的傻蛋的博客
11-12 555
$(function() { var shengfen = [["邯郸", "仓州"], ["安阳", "洛阳"]]; //给省份选项改变的事件 $("#pro").change(function() { //清空上次 $("#cityx").siblings().remove(); var sheng = $(this).val();//省份
JS省市二级联动
weixin_44496333的博客
09-12 1279
JQ的导包： 代码： <body> 省：<select name="" id="province" onchange="deomo(this.selectedIndex)"> </select> 市：<select name="" id="city"></select> <script> // 03.用一个一维数组存储省,用二维数组存储市, // 实现一个简单的省市二级联
javascript二级联动下拉框实现教程
"使用JavaScript实现二级联动下拉框的基本示例" 在网页开发中，有时候我们需要根据用户在第一个下拉框（通常是省/自治区）的选择，动态更新第二个下拉框（通常是市/地区）的内容。这种功能被称为二级联动下拉框，它...
评论 11
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值