选择省份时，自动显示对应省份的城市

最新推荐文章于 2023-08-30 10:49:24 发布

weixin_34245169

最新推荐文章于 2023-08-30 10:49:24 发布

阅读量1.7k

点赞数 1

文章标签： javascript java 数据库 ViewUI

原文链接：http://www.cnblogs.com/liner730/p/4541518.html

版权

在很多网页中，都会有让用户选择城市的选项，那么，就需要我们用js来实现，当用户选择了省份，自动选择对应省份的城市。

<head>
	<title></title>
	<meta http-equiv="content" content="text/html" charset="utf-8"/>
	<script type="text/javascript">
	var citys =[ ]; // 定义一个变量来保存省份和城市
	citys["四川"]=["成都","绵阳"];
	citys["湖南"]=["岳阳","长沙"];
	citys["广东"]=["深圳","广州"];
	var selects;



	window.οnlοad=function( ){
	selects = document.forms[0].elements; // 先找到第一个form对象
	for(var a in citys){
	selects[0].add(new Option(a,a),null);
	}
	fun()
	}


	function fun(){
	selects[1].length=0;
	var option=selects[0].options[selects[0].selectedIndex];
	var city=citys[option.text];
	for(var i=0;i<city.length;i++){
	selects[1].add(new Option(city[i],city[i]),null);
	}
	}
	</script>

	</head>

	<body>
	<form>
	<select οnclick="fun()"></select> // 定义一个各省份的选择框
	<select></select> //定义一个对应省份所在市的选择框
	</form>
	</body>
	</html>

首先用js实现当用户点击第一个的时候，对应的选择框进行城市的跳转，并清除之前选择的城市。

学习js重要的是在坚持，虽然，开始接触的时候，都觉得挺难的，但要理解实现的功能和每段代码所要实现的功能。

转载于:https://www.cnblogs.com/liner730/p/4541518.html

关注