js怎么实现三级关联

一样长的话就用三个下拉。
选中其中某一个的时候，其他两个的SelectedIndex与之相同就实现联动了

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

<html>
<head>
<script language=javascript>
var arr="浙江|江苏|安徽|江西";var arr0 = "杭州|宁波|温州|绍兴"; //这些数据可以从数据库中取得
var arr1 = "南京|苏州|无锡|常州";
var arr2 = "合肥|翕县|黄山|祁门";
var arr3 = "南昌|九江|赣州|上饶"; var arr00 = "杭州A区|杭州B区";
var arr01 = "宁波A区|宁波B区";
var arr02 = "温州A区|温州B区";
var arr03 = "绍兴A区|绍兴B区"; var arr10 = "南京A区|南京B区";
var arr11 = "苏州A区|苏州B区";
var arr12 = "无锡A区|无锡B区";
var arr13 = "常州A区|常州B区"; var arr20 = "合肥A区|合肥B区";
var arr21 = "翕县A区|翕县B区";
var arr22 = "黄山A区|黄山B区";
var arr23 = "祁门A区|祁门B区"; var arr30 = "南昌A区|南昌B区";
var arr31 = "九江A区|九江B区";
var arr32 = "赣州A区|赣州B区";
var arr33 = "上饶A区|上饶B区"; //alert(eval("arr"+2+1));
function AddOptions(dltObj,arrObj)
{
dltObj.innerHTML="";
var arrLocation=arrObj.split("|");
for(var i=0;i<arrLocation.length;i++){
var opt=document.createElement("OPTION");
dltObj.add(opt);
opt.value=i;
opt.text=arrLocation[i];
}
}
function ShowValue(){
var dltAr=document.getElementById("dltArea");
var hidId=document.getElementById("OutValue");
var txtText=document.getElementById("txtOutText");
hidId.value=dltAr.options[dltAr.selectedIndex].value;
txtText.value=dltAr.options[dltAr.selectedIndex].text;}
function init(){
AddOptions(dltProvince,eval('arr'));
AddOptions(dltCity,eval('arr'+dltProvince.selectedIndex));
AddOptions(dltArea,eval('arr'+dltProvince.selectedIndex+dltCity.selectedIndex));
ShowValue();
}
</script>
</head>
<body onLoad="init();">
<table width="300" cellpading="0" cellspacing="0" border="2">
<tr>
<td width="100"><select id="dltProvince" onchange="AddOptions(dltCity,eval('arr'+dltProvince.selectedIndex));AddOptions(dltArea,eval('arr'+dltProvince.selectedIndex+dltCity.selectedIndex));ShowValue();" style="width:100%"></select>
</td>
<td width="100"><select id="dltCity" onchange="AddOptions(dltArea,eval('arr'+dltProvince.selectedIndex+dltCity.selectedIndex));ShowValue();" style="width:100%"></select>
</td>
<td width="100"><select id="dltArea" style="width:100%" onchange="ShowValue()"></select></td>
<td width="100">
<input type="hidden" id="OutValue" value="">
<input type="text" id="txtOutText" style="width:100%">
</td>
</tr>
</table>
</body>
</html>
<html>
<head>
<title>省市县关联菜单</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<style>
body,select
{
font-size:9pt;
font-family:Verdana;
}
a
{
color:red;
text-decoration:none;
}
a:hover{
text-decoration:underline;
}
</style>
<SCRIPT LANGUAGE="JavaScript">

</SCRIPT>
<SCRIPT LANGUAGE = JavaScript>

</SCRIPT>
</head>
<body bgcolor="#E0E0E0" onload="setup()">
多级关联菜单：
<form name="frm">
<select id="s1"><option>省份</option></select>
<select id="s2"><option>地级市</option></select>
<select id="s3"><option>市、县级市、县</option></select>
</form>
</body>
</html>
var s1=document.getElementById("Select1");
        var province;
        for(var i=0;i<myAddressArray.length;i++)
        {
            if(myAddressArray[i][0]=="0")
            {
                var option = new Option(myAddressArray[i][1],myAddressArray[i][0]);
                s1.options[i]=option;
                province=myAddressArray[i][0];
            }
        }
        this.provinces(province);
}
function provinces(province)
{
    var s2=document.getElementById("Select2");
    var city;
    for(var i=0;i<myAddressArray.length;i++)
    {
        if(myAddressArray[i][2]==province)
        {
            var option = new Option(myAddressArray[i][1],myAddressArray[i][0]);
            s2.options[i]=option;
            city=myAddressArray[i][0];
            s2.options[i].selected="selected";
        }
    }
    this.citys(city);
}
function citys(city)
{
    var s3=document.getElementById("Select3");
    for(var i=0;i<myAddressArray.length;i++)
    {
        s3.remove(i);
    }
    for(var i=0;i<myAddressArray.length;i++)
    {
        if(myAddressArray[i][2]==city)
        {
            var option = new Option(myAddressArray[i][1],myAddressArray[i][0]);
            s3.options[i]=option;
            s3.options[i].selected="selected";
        }
    }
}
function $(varvalue)
{
    return document.getElementById(varvalue);
}
谢了!
我的MSN  [email protected]