<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>城市三级联动</title>
</head>
<body>
<script>
var pro=['选择','北京','上海','河南','河北'];
var city=[
[],
['朝阳区','海淀区','通州'],
['宝山区','浦东区','松山区','闸北区'],
['郑州','开封','洛阳','平顶山','南阳'],
['石家庄','廊坊','张家口']
]
window.οnlοad=function(){
provice();
document.getElementById('provice').οnchange=function(){
var Index=document.getElementById('provice').selectedIndex;
var citys=document.getElementById('city');
//alert(Index);
citys.options.length=0;
for(var i in city[Index]){
var obj1=new Option(city[Index][i],city[Index][i]);
citys.options.add(obj1);
}
}
}
function provice(){
var prov=document.getElementById('provice');
for(var i in pro){
var obj=new Option(pro[i],pro[i]);
prov.options.add(obj);
}
}
</script>
<select name="" id="provice"></select>
<select name="" id="city"></select>
</body>
</html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>城市三级联动</title>
</head>
<body>
<script>
var pro=['选择','北京','上海','河南','河北'];
var city=[
[],
['朝阳区','海淀区','通州'],
['宝山区','浦东区','松山区','闸北区'],
['郑州','开封','洛阳','平顶山','南阳'],
['石家庄','廊坊','张家口']
]
window.οnlοad=function(){
provice();
document.getElementById('provice').οnchange=function(){
var Index=document.getElementById('provice').selectedIndex;
var citys=document.getElementById('city');
//alert(Index);
citys.options.length=0;
for(var i in city[Index]){
var obj1=new Option(city[Index][i],city[Index][i]);
citys.options.add(obj1);
}
}
}
function provice(){
var prov=document.getElementById('provice');
for(var i in pro){
var obj=new Option(pro[i],pro[i]);
prov.options.add(obj);
}
}
</script>
<select name="" id="provice"></select>
<select name="" id="city"></select>
</body>
</html>