版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/qq_17522211/article/details/84580337
实现选择省份,自动对应出地市.
ps:html未设置编码可能存在乱码问题,自己引入编码即可.
另: 省份、地市、区县三级联动: https://blog.csdn.net/qq_17522211/article/details/84580492
html:
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<title>省份与省市级联</title>
</head>
<script language="javascript" src="province.js" type="text/javascript" charset="gb2312"></script>
<body onload='getProvince()'>
<div id='province'><select><option>省份</option></select></div>
<div id='city'><select><option>城市</option></select></div>
</body>
</html>
province.js:
var sity;
city=new Array(34);
city[0]=new Array(19);
city[0][0]="北京";
city[0][1]="东城";
city[0][2]="西城";
city[0][3]="宣武";
city[0][4]="朝阳";
city[0][5]="崇文";
city[0][6]="海淀";
city[0][7]="丰台";
city[0][8]="石景山";
city[0][9]="通州";
city[0][10]="平谷";
city[0][11]="顺义";
city[0][12]="怀柔";
city[0][13]="密云";
city[0][14]="延庆";
city[0][15]="昌平";
city[0][16]="门头沟";
city[0][17]="房山";
city[0][18]="大兴";
city[1]=new Array(12);
city[1][0]="上海";
city[1][1]="近郊";
city[1][2]="闵行";
city[1][3]="浦东";
city[1][4]="南汇";
city[1][5]="奉贤";
city[1][6]="金山";
city[1][7]="松江";
city[1][8]="青浦";
city[1][9]="嘉定";
city[1][10]="宝山";
city[1][11]="崇明";
city[2]=new Array(8);
city[2][0]="天津";
city[2][1]="塘沽";
city[2][2]="汉沽";
city[2][3]="宁河";
city[2][4]="静海";
city[2][5]="武清";
city[2][6]="宝坻";
city[2][7]="蓟县";
city[3]=new Array(1);
city[3][0]="重庆";
city[4]=new Array(14);
city[4][0]="内蒙古";
city[4][1]="呼和浩特";
city[4][2]="集宁";
city[4][3]="包头";
city[4][4]="临河";
city[4][5]="乌海";
city[4][6]="东胜";
city[4][7]="海拉尔";
city[4][8]="赤峰";
city[4][9]="锡林浩特";
city[4][10]="太仆寺旗";
city[4][11]="通辽";
city[4][12]="阿拉善盟";
city[4][13]="白城";
city[5]=new Array(12);
city[5][0]="河北";
city[5][1]="石家庄";
city[5][2]="衡水";
city[5][3]="邢台";
city[5][4]="邯郸";
city[5][5]="沧州";
city[5][6]="唐山";
city[5][7]="廊坊";
city[5][8]="秦皇岛";
city[5][9]="承德";
city[5][10]="保定";
city[5][11]="张家口";
city[6]=new Array(13);
city[6][0]="辽宁";
city[6][1]="沈阳";
city[6][2]="铁岭";
city[6][3]="抚顺";
city[6][4]="鞍山";
city[6][5]="营口";
city[6][6]="大连";
city[6][7]="本溪";
city[6][8]="丹东";
city[6][9]="锦州";
city[6][10]="朝阳";
city[6][11]="阜新";
city[6][12]="盘锦";
city[7]=new Array(9);
city[7][0]="吉林";
city[7][1]="长春";
city[7][2]="吉林";
city[7][3]="延吉";
city[7][4]="通化";
city[7][5]="梅河口";
city[7][6]="四平";
city[7][7]="白城";
city[7][8]="松原";
city[8]=new Array(9);
city[8][0]="黑龙江";
city[8][1]="哈尔滨";
city[8][2]="绥化";
city[8][3]="佳木斯";
city[8][4]="牡丹江";
city[8][5]="齐齐哈尔";
city[8][6]="大庆";
city[8][7]="北安";
city[8][8]="大兴安岭";
city[9]=new Array(12);
city[9][0]="江苏";
city[9][1]="南京";
city[9][2]="镇江";
city[9][3]="常州";
city[9][4]="无锡";
city[9][5]="苏州";
city[9][6]="徐州";
city[9][7]="连云港";
city[9][8]="淮阴";
city[9][9]="盐城";
city[9][10]="扬州";
city[9][11]="南通";
city[10]=new Array(12);
city[10][0]="安徽";
city[10][1]="合肥";
city[10][2]="淮南";
city[10][3]="蚌埠";
city[10][4]="宿州";
city[10][5]="阜阳";
city[10][6]="六安";
city[10][7]="巢湖";
city[10][8]="滁州";
city[10][9]="芜湖";
city[10][10]="屯溪";
city[10][11]="安庆";
city[11]=new Array(14);
city[11][0]="山东";
city[11][1]="济南";
city[11][2]="聊城";
city[11][3]="德州";
city[11][4]="淄博";
city[11][5]="东营";
city[11][6]="潍坊";
city[11][7]="烟台";
city[11][8]="青岛";
city[11][9]="泰安";
city[11][10]="济宁";
city[11][11]="荷泽";
city[11][12]="临沂";
city[11][13]="枣庄";
city[12]=new Array(12);
city[12][0]="浙江";
city[12][1]="杭州";
city[12][2]="绍兴";
city[12][3]="湖州";
city[12][4]="嘉兴";
city[12][5]="宁波";
city[12][6]="舟山";
city[12][7]="台州";
city[12][8]="金华";
city[12][9]="丽水";
city[12][10]="衢州";
city[12][11]="温州";
city[13]=new Array(11);
city[13][0]="江西";
city[13][1]="南昌";
city[13][2]="九江";
city[13][3]="景德镇";
city[13][4]="上饶";
city[13][5]="鹰潭";
city[13][6]="宜春";
city[13][7]="萍乡";
city[13][8]="赣州";
city[13][9]="吉安";
city[13][10]="抚州";
city[14]=new Array(10);
city[14][0]="福建";
city[14][1]="福州";
city[14][2]="南平";
city[14][3]="邵武";
city[14][4]="福安";
city[14][5]="厦门";
city[14][6]="泉州";
city[14][7]="漳州";
city[14][8]="龙岩";
city[14][9]="三明";
city[15]=new Array(14);
city[15][0]="湖南";
city[15][1]="长沙";
city[15][2]="株洲";
city[15][3]="益阳";
city[15][4]="岳阳";
city[15][5]="常德";
city[15][6]="吉首";
city[15][7]="娄底";
city[15][8]="怀化";
city[15][9]="衡阳";
city[15][10]="邵阳";
city[15][11]="郴州";
city[15][12]="零陵";
city[15][13]="张家界";
city[16]=new Array(10);
city[16][0]="湖北";
city[16][1]="武汉";
city[16][2]="沙市";
city[16][3]="黄石";
city[16][4]="鄂州";
city[16][5]="咸宁";
city[16][6]="襄樊";
city[16][7]="十堰";
city[16][8]="宜昌";
city[16][9]="恩施";
city[17]=new Array(15);
city[17][0]="河南";
city[17][1]="郑州";
city[17][2]="新乡";
city[17][3]="安阳";
city[17][4]="许昌";
city[17][5]="漯河";
city[17][6]="驻马店";
city[17][7]="信阳";
city[17][8]="周口";
city[17][9]="平顶山";
city[17][10]="洛阳";
city[17][11]="三门峡";
city[17][12]="南阳";
city[17][13]="开封";
city[17][14]="商丘";
city[18]=new Array(12);
city[18][0]="广东";
city[18][1]="广州";
city[18][2]="韶关";
city[18][3]="英德";
city[18][4]="梅州";
city[18][5]="汕头";
city[18][6]="惠州";
city[18][7]="深圳";
city[18][8]="湛江";
city[18][9]="茂名";
city[18][10]="肇庆";
city[18][11]="佛山";
city[19]=new Array(9);
city[19][0]="广西";
city[19][1]="南宁";
city[19][2]="百色";
city[19][3]="钦州";
city[19][4]="玉林";
city[19][5]="桂林";
city[19][6]="梧州";
city[19][7]="柳州";
city[19][8]="河池";
city[20]=new Array(8);
city[20][0]="贵州";
city[20][1]="贵阳";
city[20][2]="六盘水";
city[20][3]="玉屏";
city[20][4]="凯里";
city[20][5]="都匀";
city[20][6]="安顺";
city[20][7]="遵义";
city[21]=new Array(16);
city[21][0]="四川";
city[21][1]="成都";
city[21][2]="乐山";
city[21][3]="凉山";
city[21][4]="渡口";
city[21][5]="绵阳";
city[21][6]="汶川";
city[21][7]="雅安";
city[21][8]="甘孜";
city[21][9]="广元";
city[21][10]="南充";
city[21][11]="达州";
city[21][12]="内江";
city[21][13]="自贡";
city[21][14]="宜宾";
city[21][15]="泸州";
city[22]=new Array(13);
city[22][0]="云南";
city[22][1]="昆明";
city[22][2]="曲靖";
city[22][3]="昭通";
city[22][4]="开远";
city[22][5]="文山";
city[22][6]="思茅";
city[22][7]="大理";
city[22][8]="楚雄";
city[22][9]="临沧";
city[22][10]="保山";
city[22][11]="六盘水";
city[22][12]="渡口";
city[23]=new Array(11);
city[23][0]="陕西";
city[23][1]="西安";
city[23][2]="渭南";
city[23][3]="延安";
city[23][4]="绥德";
city[23][5]="榆林";
city[23][6]="宝鸡";
city[23][7]="汉中";
city[23][8]="安康";
city[23][9]="商洛";
city[23][10]="铜川";
city[24]=new Array(13);
city[24][0]="甘肃";
city[24][1]="兰州";
city[24][2]="武威";
city[24][3]="张掖";
city[24][4]="酒泉";
city[24][5]="安西";
city[24][6]="金昌";
city[24][7]="天水";
city[24][8]="定西";
city[24][9]="平凉";
city[24][10]="西峰";
city[24][11]="陇西";
city[24][12]="甘南";
city[25]=new Array(5);
city[25][0]="宁夏";
city[25][1]="银川";
city[25][2]="吴忠";
city[25][3]="石咀山";
city[25][4]="固原";
city[26]=new Array(7);
city[26][0]="青海";
city[26][1]="西宁";
city[26][2]="果洛";
city[26][3]="玉树";
city[26][4]="格尔木";
city[26][5]="海西";
city[26][6]="阿坝";
city[27]=new Array(11);
city[27][0]="新疆";
city[27][1]="乌鲁木齐";
city[27][2]="石河子";
city[27][3]="乌苏";
city[27][4]="克拉玛依";
city[27][5]="伊宁";
city[27][6]="吐鲁番";
city[27][7]="哈密";
city[27][8]="巴音郭楞";
city[27][9]="阿克苏";
city[27][10]="喀什";
city[28]=new Array(8);
city[28][0]="西藏";
city[28][1]="拉萨";
city[28][2]="那曲";
city[28][3]="昌都";
city[28][4]="山南";
city[28][5]="日喀则";
city[28][6]="阿里";
city[28][7]="林芝";
city[29]=new Array(4);
city[29][0]="海南";
city[29][1]="海口";
city[29][2]="三亚";
city[29][3]="海南";
city[30]=new Array(12);
city[30][0]="山西";
city[30][1]="太原";
city[30][2]="离石";
city[30][3]="忻州";
city[30][4]="宁武";
city[30][5]="大同";
city[30][6]="临汾";
city[30][7]="侯马";
city[30][8]="运城";
city[30][9]="阳泉";
city[30][10]="长治";
city[30][11]="晋城";
city[31]=new Array(17);
city[31][0]="台湾";
city[31][1]="台北";
city[31][2]="台中";
city[31][3]="基隆";
city[31][4]="台南";
city[31][5]="嘉义";
city[31][6]="桃园";
city[31][7]="苗粟";
city[31][8]="屏东";
city[31][9]="南投";
city[31][10]="花莲";
city[31][11]="新竹";
city[31][12]="彰化";
city[31][13]="高雄";
city[31][14]="宜兰";
city[31][15]="台东";
city[31][16]="彭湖";
city[32]=new Array(1);
city[32][0]="香港";
city[33]=new Array(1);
city[33][0]="澳门";
//如果想修改省份为Button 就修改这里
function getRegion() {
document.getElementById("city").innerHTML="";
var provinces=document.getElementById("provinces");
var prov=provinces[provinces.selectedIndex].value;
var str="<select>";
for(var i=0;i<city[prov].length;i++)
{
str=str+"<option>"+city[prov][i]+"</option>";
}
str=str+"</select>";
document.getElementById("city").innerHTML=str;
}
//如果想修改城市为Button 就修改这里
function getProvince() {
var strs="<select onchange='getRegion()' id='provinces'><option></option>";
for(var i=0;i<=33;i++) {
strs=strs+"<option value="+i+">"+city[i][0]+"</option>";
}
strs=strs+"</select>";
document.getElementById('province').innerHTML=strs;
}