js二级联动菜单

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
  <HEAD>
  <TITLE> New Document </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">
  <script language="JavaScript" type="text/javascript">
     //定义了城市的二维数组,里面的顺序跟省份的顺序是相同的。通过selectedIndex获得省份的下标值来得到相应的城市数组
     var city=[
     ["永乐中山公园","苏宁浦东","苏宁长宁"],
     ["大中中塔","苏宁联想桥","国美马甸鹏润"],
     ["苏宁淮海路"],
     ["国美胜利广场"],
     ["苏宁正佳","国美电器广州市白云区新市二店"],
	 ["苏宁西大街"],
	 ["苏宁电器湖北武汉中山店"],
	 ["国美电器辽宁沈阳市鹏润店","苏宁电器辽宁沈阳市小东店"],
	 ["国美电器山东济南省府前街店","苏宁电器山东济南泉城路店"],
	 ["苏宁群星","国美广东深圳华强二店"],
	 ["苏宁石路店"],
	 ["苏宁西安生活广场店","蜂星西安开元商城"],
	 ["重庆国美电器杨家坪店","重庆苏宁电器南坪旗舰店"]
     ];

	 var address=[
	 ["上海市长宁区长宁路1018号龙之梦购物中心B1-B2永乐电器微软店中店","上海市南泉北路569号苏宁电器微软店中店","上海市长宁路999号兆丰广场苏宁电器微软店中店"],
	 ["北京市海淀区西三环中路11号大中电器微软店中店","北京市海淀区中关村东路118号金五星市场内苏宁电器微软店中店","北京市西城区北三环中路27号马甸鹏润国美电器微软店中店"],
	 ["南京市秦淮区淮海路68号苏宁电器微软店中店"],
 	 ["大连市中山区胜利广场28号A座国美电器微软店中店"],
 	 ["广州市体育东路正佳广场东侧广晟大厦苏宁电器微软店中店","广州市白云区广花四路齐富路口"],
	 ["成都市金牛区三洞桥街19号国贸广场苏宁电器微软店中店"],
	 ["解放大道武汉广场对面万松园路口"],
 	 ["沈阳市和平区中华路15号国美电器","沈阳市大东区东顺城街17号苏宁易购一楼"],
 	 ["济南历下区泉城路266号天业国际一楼","济南市历下区泉城路322号惠尔商厦一楼苏宁电器"],
	 ["深圳市福田区华强北红荔路群星广场苏宁电器微软店","华强北万商电器城一楼"],
	 ["苏州市姑苏区金门路158号协和大厦1层苏宁电器微软店中店"],
 	 ["安市新城区解放路和东新街十字路口西南角","西安市钟楼印布花园1号"],
 	 ["杨家坪正街17号","重庆市南岸区南坪西路建玛特B座"]
	 ]
     ;

	//alert('12332'+address[0][0]);

     function getShop(s){
         //获得省份下拉框的对象
         var sltProvince=document.form1.province;
         //获得城市下拉框的对象
         var sltCity=document.form1.city;   
		 
         //得到对应省份的城市数组
         var provinceCity=city[sltProvince.selectedIndex - 1];
		
		 document.getElementById("date").value="";
         //清空城市下拉框,仅留提示选项
         sltCity.length=1;
 
         //将城市数组中的值填充到城市下拉框中
         for(var i=0;i<provinceCity.length;i++){
             sltCity[i+1]=new Option(provinceCity[i],provinceCity[i]);
         }
		 
     }

	 function getCity2(s){
		var cc=document.getElementById("city2").selectedIndex;
		if(s!=0){
			document.getElementById("date").value=address[cc-1][s-1];
		}else{
			document.getElementById("date").value="";
		}
		
		//alert(s);
	 }
 </script>
 </HEAD>
 
 <BODY>
 <FORM METHOD=POST ACTION="" name="form1">
         <SELECT NAME="province" onChange="getShop(this.selectedIndex)" id="city2">
             <OPTION value="0">请选择城市</OPTION>
             <OPTION value="上海">上海</OPTION>
             <OPTION value="北京">北京</OPTION>
             <OPTION value="南京">南京</OPTION>
             <OPTION value="大连">大连</OPTION>
             <OPTION value="广州">广州</OPTION>
			 <OPTION value="成都">成都</OPTION>
			 <OPTION value="武汉">武汉</OPTION>
			 <OPTION value="沈阳">沈阳</OPTION>
			 <OPTION value="济南">济南</OPTION>
			 <OPTION value="深圳">深圳</OPTION>
			 <OPTION value="苏州">苏州</OPTION>
			 <OPTION VALUE="西安">西安</OPTION>
			 <OPTION VALUE="重庆">重庆</OPTION>
         </SELECT>
         <SELECT NAME="city" onChange="getCity2(this.selectedIndex)" id="shop">
             <OPTION VALUE="0">请选择门店</OPTION>
         </SELECT>
		 时间:<input type="text" value="" id="date" disabled="disabled"><br/>
     </FORM>
 </BODY>
</HTML>





原文地址:http://blog.sina.com.cn/s/blog_8231283801015aiv.html


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值