当前位置：首页 > 编程资源 > 编程问答 >内容正文

编程问答

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

发布时间：2025/3/15 编程问答 52 豆豆

生活随笔收集整理的这篇文章主要介绍了选择省份时，自动显示对应省份的城市小编觉得挺不错的,现在分享给大家,帮大家做个参考.

在很多网页中，都会有让用户选择城市的选项，那么，就需要我们用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

以上是生活随笔为你收集整理的选择省份时，自动显示对应省份的城市的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错，欢迎将生活随笔推荐给好友。