版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/qq_34928644/article/details/80972767
select对象省份-->城市二级联动实例
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
function changeCity( oSelectNode ){
var jsonCitys={
"none":[
{"value":"none","text":"请选择"}
],
"beiJing":[
{"value":"chaoYang","text":"朝阳区"},
{"value":"haiDian","text":"海淀区"},
{"value":"dongCheng","text":"东城区"},
{"value":"xiCheng","text":"西城区"}
],
"huNan":[
{"value":"yiYang","text":"益阳"},
{"value":"changSha","text":"长沙"},
{"value":"zhuZhou","text":"株洲"},
{"value":"changDe","text":"常德"}
],
"fuJian":[
{"value":"puTian","text":"莆田"},
{"value":"fuZhou","text":"福州"},
{"value":"xiaMen","text":"厦门"},
{"value":"quanZhou","text":"泉州"}
]
};
var arrCitys = jsonCitys[oSelectNode.value];
var oSelectCity = document.getElementsByName("selCity")[0];
oSelectCity.innerHTML ="<option value='none'>请选择</option>";
for ( x in arrCitys ) {
oSelectCity.innerHTML += "<option value='"+ arrCitys[x]["value"] +"'>"+arrCitys[x]["text"]+"</option>"
}
}
function change( oSelectNode ){
alert( oSelectNode.value );
}
</script>
</head>
<body>
省份<select name="selProv" onchange="changeCity(this);">
<option value="none">请选择</option>
<option value="beiJing">北京</option>
<option value="huNan">湖南</option>
<option value="fuJian">福建</option>
</select>
城市<select name="selCity" onchange="change(this);">
<option value="none">请选择</option>
</select>
</body>
</html>