五省联动实现二

最新推荐文章于 2020-10-10 09:48:33 发布

zhangshengsky

最新推荐文章于 2020-10-10 09:48:33 发布

阅读量267

点赞数

分类专栏： JS

本文链接：https://blog.csdn.net/zhangshengsky/article/details/72796588

版权

JS 专栏收录该内容

16 篇文章 0 订阅

订阅专栏

	<body>
		<select id= "province" οnchange="changProvince(this.value);" >
			<option >--请选择--</option>
			<option value="北京">北京</option>
			<option value="南京">南京</option>
			<option value="天津">天津</option>
			<option value="厦门">厦门</option>
		</select>
		
		<select id= "city"  >
			<option >--请选择--</option>
		</select>
	<script type="text/javascript">
			var city = new Array(4);
			city[0]=['北京','东城区','西城区','朝阳区','海淀区'];
			city[1]=['南京','玄武区','秦淮区','鼓楼区','建邺区'];
			city[2]=['天津','北辰区','武清区','宝坻区','滨海新区'];
			city[3]=['厦门','湖里区','思明区','集美区','同安区'];
		
			var citysel1 = document.getElementById('province');
			var citysel2 = document.getElementById('city');
		
		function changProvince(brown){
			var cityop2 = document.getElementsByTagName('option');
			for(var i=0;i<cityop2.length;i++){
				citysel2.remove(cityop2[i]);
			}
			for(var i=0;i<city.length;i++){
				var citys = city[i];
				if(citys[0] == brown){
					for(var m=1;m<citys.length;m++){
						var ops = document.createElement('option');
						var txt = document.createTextNode(citys[m]);
						ops.appendChild(txt);
						citysel2.appendChild(ops);
					}
				}
			}
		}
	</script>
	</body>