JS数组——实现省市连动操作

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>实现简单的省市连动</title>
</head>
<body>
	<select id="pro" style="margin-left: 200px;" onchange="javascript:changeCity();">
		
	</select>
	<select id="city">
		
	</select>
</body>
	<script type="text/javascript">
		var pro = document.getElementById("pro");
		var city = document.getElementById("city");
		var str = [['省份1', '1城市1', '1城市2', '1城市3', '1城市4', '1城市5', '1城市6', '1城市7', '1城市8']];

		for(var i = 1; i <= 5; i++) {
			var temp = [];
			temp[0] = '省份' + (i+1);
			for(j = 1; j < 9; j++) {
				temp[j] = (i+1) + "城市" + j;
			}
			str[i] = temp;
		} 

		load();

		function load() {
			for(var i = 0; i < str.length; i++) {
				var oppro = new Option(str[i][0], i);
				pro.options.add(oppro);
			}
			for (var j = 1; j < str[0].length; j++) {
				var opcity = new Option(str[0][j], str[0][j]);
				city.options.add(opcity);
			}
		}

		function changeCity() {
			city.options.length = 0;			//清除option选项中的内容
			//alert(pro.value);
			for (var j = 1; j < str[pro.value].length; j++) {
				var opcity = new Option(str[pro.value][j], i);
				city.options.add(opcity);
			}
		}

	</script>
</html>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值