一个省市区三级联动菜单
<script>
var myproc = ["省1","省2","省3","省4"];
var mycity = new Array();
mycity[0] = ["省1市1","省1市2","省1市3","省1市4"];
mycity[1] = ["省2市1","省2市2","省2市3"];
mycity[2] = ["省3市1","省4市2"];
mycity[3] = ["省4市1","省4市2"];
var myregion = new Array();
myregion[0]=new Array();
myregion[1]=new Array();
myregion[2]=new Array();
myregion[3]=new Array();
myregion[0][0]=["省1市1区1","省1市1区2"];
myregion[0][1]=["省1市2区1","省1市2区2"];
myregion[0][2]=["省1市3区1","省1市3区2"];
myregion[0][3]=["省1市4区1","省1市4区2"];
myregion[1][0]=["省2市1区1","省2市1区2"];
myregion[1][1]=["省2市2区1","省2市2区2"];
myregion[1][2]=["省2市3区1","省2市3区2"];
myregion[2][0]=["省3市1区1","省3市1区2"];
myregion[2][1]=["省3市2区1","省3市2区2"];
myregion[3][0]=["省4市1区1","省4市1区2"];
myregion[3][1]=["省4市2区1","省4市2区2"];
function addproc(){
var proc = document.getElementById("proc");
for(var i=0; i<myproc.length; i++){
var op = document.createElement("option");
var city = document.createTextNode(myproc[i]);
op.appendChild(city);
proc.appendChild(op);
}
}
function selproc(){
var proc = document.getElementById("proc");
var city = document.getElementById("city");
var region = document.getElementById("region");
city.options.length=1;
region.options.length=1;
if(proc.value=="-1"){
document.getElementById("mytxt").value="";
}else{
var num = proc.options.selectedIndex;
for(var i=0; i<mycity[num-1].length; i++){
var op = document.createElement("option");
var city1 = document.createTextNode(mycity[num-1][i]);
op.appendChild(city1);
city.appendChild(op);
}
}
}
function selcity(){
var proc = document.getElementById("proc");
var city = document.getElementById("city");
var region = document.getElementById("region");
region.options.length=1;
if(proc.value=="-1"){
document.getElementById("mytxt").value="";
}else{
var num = proc.options.selectedIndex;
var n = city.options.selectedIndex;
for(var i=0; i<myregion[num-1][n-1].length; i++){
var op = document.createElement("option");
var r = document.createTextNode(myregion[num-1][n-1][i]);
op.appendChild(r);
region.appendChild(op);
}
}
}
</script>
</head>
<body onload="addproc()">
选择省市地区：
<select id="proc" name="proc" onchange="selproc()">
<option value="-1">--请选择省份--</option>
</select>
<select id="city" name="city" onchange="selcity()">
<option value="-1">--请选择城市--</option>
</select>
<select id="region" name="region" onchange="selregion()">
<option value="-1">--请选择地区--</option>
</select>