开始二级联动, 点击“其他”后变成三级联动菜单!

第一次写博客微笑,如有雷同,纯属抄袭!见谅, 见谅!

放在body里面的代码

<div class="">
	<select id="born" name="born" class="" onChange="getCity(this.options[this.selectedIndex].value)">
		<option value="请选择">请选择</option>
		<option value="上海市及随迁子女">上海市及随迁子女</option>
		<option value="常州市">常州市</option>
		<option value="其它">其它</option>
	</select>
</div>

<div class="" id="nameInfor_two">
	<select name="" class="" id="city" runat="server">
		<option>请选择</option>
	</select>
</div>

<div class="" id="nameInfor_three" style="display: none;">
	<select name="" class="" id="city1" runat="server" onChange="getCity2(this.options[this.selectedIndex].value)">
		<option value="请选择">请选择</option>
		<option value="广州市">广州市</option>
		<option value="常州市">常州市</option>
		<option value="其它">其它</option>
	</select>
	<select name="" class="" id="city2" runat="server">
		<option>请选择</option>
	</select>
</div>

<script>里面代码

<script language="javascript" type="text/javascript">
	//定义 城市 数据数组  
	cityArray = new Array();
	cityArray[0] = new Array("上海市及随迁子女", "静安区|长宁区|徐汇区|杨浦区|虹口区|普陀区|宝山区|闵行区|嘉定区");
	cityArray[1] = new Array("常州市", "钟楼区|天宁区|武进区|无人区");
	cityArray[2] = new Array("其它", "其它");
	cityArray[3] = new Array("请选择", "请选择");

	cityArray1 = new Array();
	cityArray1[0] = new Array("广州市", "静安区|长宁区|徐汇区|杨浦区|虹口区|普陀区|宝山区|闵行区|嘉定区");
	cityArray1[1] = new Array("常州市", "钟楼区|天宁区|武进区|无人区");
	cityArray1[2] = new Array("其它", "其它");
	cityArray1[3] = new Array("请选择", "请选择");

	function getCity(currProvince) {
		//当前 所选择 的 省  
		var currProvince = currProvince;
		var i, j, k;
		//清空 城市 下拉选单  
		document.all.city.length = 0;
		for(i = 0; i < cityArray.length; i++) {
			//得到 当前省 在 城市数组中的位置  
			if(cityArray[i][0] == currProvince) {
				//得到 当前省 所辖制的 地市  
				var tmpcityArray = cityArray[i][1].split("|")
				for(j = 0; j < tmpcityArray.length; j++) {
					//填充 城市 下拉选单  
					document.all.city.options[document.all.city.length] = new Option(tmpcityArray[j], tmpcityArray[j]);
				}
				document.getElementById("nameInfor_two").style.display = "block";
				document.getElementById("nameInfor_three").style.display = "none";
			} else if(cityArray[2][0] == currProvince) {
				document.getElementById("nameInfor_two").style.display = "none";
				document.getElementById("nameInfor_three").style.display = "block";

			}
		}
	}

	function getCity2(ob) {
		var ob = ob;
		var x, y, z;
		document.all.city2.length = 0;
		for(i = 0; i < cityArray1.length; i++) {
			if(cityArray1[i][0] == ob) {
				//得到 当前省 所辖制的 地市  
				var tmpcityArray = cityArray1[i][1].split("|")
				for(j = 0; j < tmpcityArray.length; j++) {
					//填充 城市 下拉选单  
					document.all.city2.options[document.all.city2.length] = new Option(tmpcityArray[j], tmpcityArray[j]);
				}
			}
		}
	}
</script>

 

 

 

 

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值