<!DOCTYPE html><html lang="en"><head> ???<meta charset="UTF-8"> ???<title>选择地区</title></head><script type="text/javascript"> ???var regionList=[]; ???regionList["湖南省"]=["长沙市","株洲市","邵阳市"]; ???regionList["广东省"]=["广州市","深圳市","东莞市"]; ???onload=function(){ ???????var selectProvince=document.querySelector("#province");//这个地方使用for(var i=0;i<region.length;i++)就会报错，不知道是为啥，麻烦知道的大神给指导下哈 ???????for(var i in regionList){ ???????????var element=document.createElement("OPTION"); ???????????element.value=i; ???????????element.innerHTML=i; ???????????selectProvince.appendChild(element); ???????} ???} ???function changeCity(){ ???????var selectProvince=document.querySelector("#province"); ???????var selectCity=document.querySelector("#city"); ???????selectCity.innerHTML="<option>请选择城市/地区</option>"; ???????for(var i in regionList[selectProvince.value]){ ???????????var element=document.createElement("OPTION"); ???????????element.value=regionList[selectProvince.value][i]; ???????????element.innerHTML=regionList[selectProvince.value][i]; ???????????selectCity.appendChild(element); ???????} ???}</script><body><div id="main"> ???<dl class="register_row"> ???????<dt>所在地区：</dt> ???????<dd> ???????????<select id="province" onChange="changeCity()" style="width:120px;"> ???????????????<option>请选择省/城市</option> ???????????</select> ???????</dd> ???????<dd> ???????????<select id="city" ?style="width:130px;"> ???????????????<option>请选择城市/地区</option> ???????????</select> ???????</dd> ???</dl></div></body></html>js注册表单中实现地区选择效果
原文地址：https://www.cnblogs.com/helloworldlx/p/8975829.html