1 <!DOCTYPE html>
2 <html>
3 <head>
4 <meta charset="UTF-8">
5 <title></title>
6 <script type="text/javascript">
7
8
9 function getEara(){
10 var province=document.getElementById("province").value;
11
12 if(province=='bj'){
13 document.getElementById("eara").innerHTML=
14 "<option>---请选择---</option><option value='dc'>东城区</option><option value='xc'>西城区</option><option value='xw'>宣武区</option><option value='cy'>朝阳区</option>";
15 }
16 if(province=='sh'){
17 document.getElementById("eara").innerHTML=
18 "<option>---请选择---</option><option value='cn'>长宁区</option><option value='hf'>黄浦区</option><option value='lw'>卢湾区</option><option value='xh'>徐汇区</option>";
19 }
20 if(province=='tj'){
21 document.getElementById("eara").innerHTML=
22 "<option>---请选择---</option><option value='hp'>和平区</option><option value='hd'>河东区</option><option value='hx'>河西区</option><option value='nk'>南开区</option>";
23 }
24 }
25 function getCity(){
26 var cityArr=new Array(12);
27
28 cityArr[0]=new Array("东城区01","东城区02","东城区03","东城区04");
29 cityArr[1]=new Array("西城区01","西城区02","西城区03","西城区04");
30 cityArr[2]=new Array("宣武区01","宣武区02","宣武区03","宣武区04");
31 cityArr[3]=new Array("朝阳区01","朝阳区02","朝阳区03","朝阳区04");
32 cityArr[4]=new Array("长宁区01","长宁区02","长宁区03","长宁区04");
33 cityArr[5]=new Array("黄浦区01","黄浦区02","黄浦区03","黄浦区04");
34 cityArr[6]=new Array("卢湾区01","卢湾区02","卢湾区03","卢湾区04");
35 cityArr[7]=new Array("徐汇区01","徐汇区02","徐汇区03","徐汇区04");
36 cityArr[8]=new Array("和平区01","和平区02","和平区03","和平区04");
37 cityArr[9]=new Array("河东区01","河东区02","河东区03","河东区04");
38 cityArr[10]=new Array("河西区01","河西区02","河西区03","河西区04");
39 cityArr[11]=new Array("南开区01","南开区02","南开区03","南开区04");
40 var eara=document.getElementById("eara").value;
41 var city=document.getElementById("city");
42
43 var j;
44 if(eara=="dc"){
45 j=0;
46 }
47 if(eara=="xc"){
48 j=1;
49 }
50 if(eara=="xw"){
51 j=2;
52 }
53 if(eara=="cy"){
54 j=3;
55 }
56 if(eara=="cn"){
57 j=4;
58 }
59 if(eara=="hf"){
60 j=5;
61 }
62 if(eara=="lw"){
63 j=6;
64 }
65 if(eara=="xh"){
66 j=7;
67 }
68 if(eara=="hp"){
69 j=8;
70 }
71 if(eara=="hd"){
72 j=9;
73 }
74 if(eara=="hx"){
75 j=10;
76 }
77 if(eara=="nk"){
78 j=11;
79 }
80 city.options.length=1;
81 for(var i=0;i<cityArr[i].length;i++){
82
83 var cityText=document.createTextNode(cityArr[j][i]);
84 var newNode=document.createElement("option");
85 newNode.appendChild(cityText);
86 city.appendChild(newNode);
87
88 }
89 }
90 </script>
91 </head>
92 <body>
93 <div align="center" >
94 请选择地址
95 <select id="province" onchange="getEara()">
96 <option>---请选择---</option>
97 <option value="bj">北京</option>
98 <option value="sh">上海</option>
99 <option value="tj">天津</option>
100 </select>
101 <select id="eara" onchange="getCity()">
102 <option>---请选择---</option>
103 </select>
104 <select id="city">
105 <option>---请选择---</option>
106 </select>
107 </div>
108 </body>
109 </html>
