js省市二级联动(个别城市)
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> </head> <style type="text/css"> #log { height: 500px; margin: 0 auto; background: #9999FF; width: 500px; } .ys { margin: 20px; width: 200px; height: 30px; background: #9999FF; } </style> <body> <div id="log"> <form action="" method="get"> <select class="ys" id="province" onchange="getcity()"> </select> <select class="ys" id="city"> </select> </form> </div> </body> <script type="text/javascript"> var province=document.getElementById('province'); var city=document.getElementById('city'); // province的text var arr_1=new Array('北京','上海','天津','重庆','河北','山西','内蒙古','辽宁','吉林','黑龙江','江苏','浙江','安徽'); var arr=new Array();//city的text arr[0] = "东城,西城,崇文,宣武,朝阳,丰台,石景山,海淀,门头沟,房山,通州,顺义,昌平,大兴,平谷,怀柔,密云,延庆" arr[1] = "黄浦,卢湾,徐汇,长宁,静安,普陀,闸北,虹口,杨浦,闵行,宝山,嘉定,浦东,金山,松江,青浦,南汇,奉贤,崇明" arr[2] = "和平,东丽,河东,西青,河西,津南,南开,北辰,河北,武清,红挢,塘沽,汉沽,大港,宁河,静海,宝坻,蓟县" arr[3] = "万州,涪陵,渝中,大渡口,江北,沙坪坝,九龙坡,南岸,北碚,万盛,双挢,渝北,巴南,黔江,长寿,綦江,潼南,铜梁,大足,荣昌,壁山,梁平,城口,丰都,垫江,武隆,忠县,开县,云阳,奉节,巫山,巫溪,石柱,秀山,酉阳,彭水,江津,合川,永川,南川" arr[4] = "石家庄,邯郸,邢台,保定,张家口,承德,廊坊,唐山,秦皇岛,沧州,衡水" arr[5] = "太原,大同,阳泉,长治,晋城,朔州,吕梁,忻州,晋中,临汾,运城" arr[6] = "呼和浩特,包头,乌海,赤峰,呼伦贝尔盟,阿拉善盟,哲里木盟,兴安盟,乌兰察布盟,锡林郭勒盟,巴彦淖尔盟,伊克昭盟" arr[7] = "沈阳,大连,鞍山,抚顺,本溪,丹东,锦州,营口,阜新,辽阳,盘锦,铁岭,朝阳,葫芦岛" arr[8] = "长春,吉林,四平,辽源,通化,白山,松原,白城,延边" arr[9] = "哈尔滨,齐齐哈尔,牡丹江,佳木斯,大庆,绥化,鹤岗,鸡西,黑河,双鸭山,伊春,七台河,大兴安岭" arr[10] = "南京,镇江,苏州,南通,扬州,盐城,徐州,连云港,常州,无锡,宿迁,泰州,淮安" arr[11 ]="杭州,宁波,温州,嘉兴,湖州,绍兴,金华,衢州,舟山,台州,丽水" arr[12 ]="合肥,芜湖,蚌埠,马鞍山,淮北,铜陵,安庆,黄山,滁州,宿州,池州,淮南,巢湖,阜阳,六安,宣城,亳州" for(var i=0;i<arr_1.length;i++){ //创建option a[i]=new Option("text","value","true","true"); var option=document.createElement('option'); province.appendChild(option); option.text=arr_1[i]; } var a=arr[0].split(',');// 字符逗号切割 typeof(a) = 'obj' for(var i=0;i<a.length;i++){ //为city赋值同上 var option=document.createElement('option'); city.appendChild(option); option.text=a[i]; } function getcity(){ //onchange事件用于select和input单选框和复选框的值改变 var flag=province.selectedIndex;//当前的select的index city.length=0;//清空city的select的内容即长度 a=arr[flag].split(',');//同上 for(var i=0;i<a.length;i++){ var option=document.createElement('option'); city.appendChild(option); option.text=a[i]; } } </script> </html>
doublekai.com