jsp+js省市区三级联动

Posted 2022-03-31 zhangsblog12345

<select id="province">
<option value="-1">请选择</option>
</select>>
<select id="city"></select>>
<select id="town"></select>>
<script>
var provinceArr = [ ‘江苏‘, ‘浙江‘ ];
var cityArr=[[‘南京市‘,‘苏州市‘,‘常州市‘,‘无锡市‘,‘镇江市‘],[‘杭州市‘,‘宁波市‘,‘温州市‘,‘绍兴市‘]];
var townArr=[[[‘玄武区‘,‘秦淮区‘,‘鼓楼区‘,‘建邺区‘,‘雨花台区‘,‘栖霞区‘,‘浦口区‘,‘六合区‘,‘江宁区‘,‘溧水区‘],[‘吴中区‘,‘虎丘区‘,‘工业园区‘],[‘金坛市‘,‘钟楼区‘,‘天宁区‘],[‘梁溪区‘,‘滨湖区‘,‘惠山区‘,‘锡山区‘,‘江阴市‘],[‘京口区‘,‘润州区‘,‘丹徒区‘]],
[[‘上城区‘,‘下城区‘,‘余杭区‘,‘拱墅区‘,‘西湖区‘,‘江干区‘],[‘江东区‘,‘海曙区‘,‘鄞州区‘,‘江北区‘,‘镇海区‘,‘北仑区‘],[‘鹿城区‘,‘龙湾区‘,‘瓯海区‘,‘永嘉县‘],[‘越城区‘,‘柯桥区‘,‘上虞区‘,‘诸暨市‘,‘嵊州市‘,‘新昌县‘]]];
function createOption(obj,dara)
for(var i in dara)
var op=new Option(dara[i],i);
obj.options.add(op);


var province = document.getElementById("province")
createOption(province,provinceArr);

var city = document.getElementById("city")
province.onchange=function()
city.options.length=0;
createOption(city,cityArr[province.value]);


var town = document.getElementById("town")
city.onchange=function()
town.options.length=0;
createOption(town,townArr[province.value][city.value]);


</script>