初学Js-省市联动基本概念-事件编程

简单的下拉菜单选择省份,自动弹出这个省份的市级。可将该程序继续扩展到省市县三级联动!
<html>
<head>
	<title>事件编程</title>
</head>
<script type="text/javascript">

		function testChange(){
			//获取被选中的内容
			var jiguan=document.getElementById("jiguan").value;
			var city=document.getElementById("city");
			//每次要先清空城市select的内容,否则+=会累计
			city.innerHTML="";
			if(jiguan=="甘肃"){
				//把一些option的选项放到城市的select中。
				var arr=["酒泉","兰州","敦煌"];
				for(var i=0;i<arr.length;i++){
					city.innerHTML+="<option value='"+arr[i]+"'>"+arr[i]+"</option>";
					//+=代表,有几个就拼几个进去,拼起来!
				}
			}else if(jiguan=="湖南"){
				var arr=["长沙","常德","湘潭"];
				for(var i=0;i<arr.length;i++){
					city.innerHTML+="<option value='"+arr[i]+"'>"+arr[i]+"</option>";
				}				
			}else if(jiguan=="四川"){
				var arr=["成都","绵阳","都江堰"];
				for(var i=0;i<arr.length;i++){
					city.innerHTML+="<option value='"+arr[i]+"'>"+arr[i]+"</option>";
				}				
			}
		}
</script>
<body>
<select onchange="testChange()" id="jiguan">
	<option value="甘肃">甘肃</option>
	<option value="湖南">湖南</option>
	<option value="四川">四川</option>
</select>
<select id="city">
</select>
</body>
</html>

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值