<form method=post name=fm>
<select onchange=chg(selectedIndex) name=a>
<option>亚洲
<option>欧洲
<option>美洲
</select>
<select name=b onchange="r.value=value">
<option>请选择
</select>
<input name=r id=r>
</form>
<script>
var arr=[["中国","日本","朝鲜","新加坡"],["英国","法国","意大利"],["美国","加拿大","巴西"]]
function chg(i){
with(document.fm.b){
length=0;
for(j=0;j<arr[i].length;j++)
options.add(new Option(arr[i][j],arr[i][j]))
document.fm.r.value=value+document.fm.a.value
}
}
chg(0)
</script>

解决方案 »

  1.   

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <HTML>
    <HEAD>
    <TITLE> New Document </TITLE>
    <META NAME="Generator" CONTENT="EditPlus">
    <META NAME="Author" CONTENT="">
    <META NAME="Keywords" CONTENT="">
    <META NAME="Description" CONTENT="">
    <script language="JavaScript" type="text/javascript">
    <!--
    var province_ar=new Array("","学历文凭|旅游管理,工商企业管理,文秘,金融,国际贸易,会计,英语,计算机应用,法律,艺术设计","成人高教|工商企业管理,国际经济与贸易,外贸英语,计算机应用与管理,艺术设计","高教自考|饭店管理,工商企业管理,中英合作商务管理,保险,国际贸易,英语,电子商务,计算机及应用,法律,广告");function show_province()
    {
    var pro_tmp=document.all.province;
    for (m=pro_tmp.options.length-1;m>0;m--)
    pro_tmp.options[m]=null; for(i=0;i<province_ar.length;i++)
    {
    if(province_ar[i]!="")
    {
    tmp=province_ar[i].split("|");
    pro_tmp.options[i]=new Option(tmp[0],tmp[0]);
    }
    }
    }
    function show_city(sc)
    {
    var temp=document.all.city;
    for (m=temp.options.length-1;m>0;m--)
    temp.options[m]=null; if(province_ar[sc]!="")
    {
    tmp=province_ar[sc].split("|");
    tmp=tmp[1];
    tmp=tmp.split(",");
    for(i=0;i<tmp.length;i++)
    {
    temp.options[i]=new Option(tmp[i],tmp[i]);
    }
    }
    }
    setTimeout("show_province();",20);//第一个搜索中省份城市对应
    -->
    </script>
    </HEAD><BODY>
    <FORM name="testform" id="testform">
    <select id=province 
          onchange=show_city(this.options.selectedIndex)>
    <OPTION value="" selected>请选择类别</option>
    </select>
    <select id=city>
        <OPTION value="" selected>请选择专业</OPTION>
    </select>
    <select id=city1>
        <OPTION value="" selected>请选择专业</OPTION>
    </select>
    </FORM>
    </BODY>
    </HTML>
      

  2.   

    1.多级关联菜单(一)
    <BODY>
    <SELECT NAME="s1"><option>需要JavaScript才能正确显示</SELECT>
    <SELECT NAME="s2"></SELECT>
    <SELECT NAME="s3"></SELECT>
    <SELECT NAME="s4"></SELECT>
    <SCRIPT LANGUAGE="JavaScript">
    <!--
    //选择框的名字
    selector = [ "s1", "s2", "s3", "s4" ];
    //选择项: "名字", "值", 子选择
    menu = [
    "地球","1",
     [
     "中国","86",
      [
      "北京","BJ",
       [
       "--","1",null
       ],
      "四川","SC",
       [
       "成都","28",null,
       "乐山","",null,
       "攀枝花","",null,
       "自贡","",null,
       "德阳","",null,
       "绵阳","",null
       ]
      ],
     "米国","1",
      [
      "加利福尼亚","CA",
       [
       "旧金山","1",null,
       "洛杉矶","2",null
       ],
      "华盛顿","WA",
       [
       "西雅图","seattle",null
       ]
      ]
     ],
    "火星","2",
     [
     "大峡谷","86",
      [
      "小山丘","BJ",
       [
       "A地区","28",null,
       "B地区","",null,
       "C地区","",null
       ]
      ]
     ]
    ];
     
    function wizz(level)
    {
     if( level == 0 )
      a = menu;
     else
     {
      str = "menu";
      for( i=0; i<level; i++ )
       str += "[" + (document.all[selector[i]].selectedIndex * 3 + 2)  + "]";
      a = eval(str);
     }
     if( a == null ) return;
     s = document.all[selector[level]];
     i = s.length;
     while( i > 0 ) s.options[--i] = null;
     while( i < Math.floor(a.length/3) )
      s.options[i] = Option( a[i*3], a[i++*3+1] );
     s.onchange = Function("wizz(" + (level+1) + ")");
     wizz(level+1);
    }
    wizz(0);
    //-->
    </SCRIPT>
    </BODY>
    </HTML>
    2.多级连动(二)
    <select name=year></select>
    <select name=month></select>
    <select name=date></select>
    <select name=clock></select>
    <input name=result>
    <script>
    var arrSel=["year","month","date","clock"];//arrSel定义了要修改的下拉框和xml数据的节点名称
    </script>
    <xml id=xmldata>
     <xmldata>
      <year value="2000">
       <month value="4">
        <date value="14">
         <clock value="一点" />
         <clock value="三点" />
        </date>
        <date value="17">
         <clock value="一点" />
        </date>
       </month>
       <month value="5">
        <date value="15">
         <clock value="一点" />
         <clock value="四点" />
         <clock value="七点" />
        </date>
       </month>
      </year>
      <year value="2001">
       <month value="7">
        <date value="16">
         <clock value="一点" />
         <clock value="五点" />
         <clock value="九点" />
        </date>
       </month>
      </year>
     </xmldata>
    </xml>
    <script>
    function qswhXml(num){
    /******* by qiushuiwuhen(2002-5-17) ********/
     var i,j,arrTemp=[];
     for(i=0;i<num;i++)arrTemp[i]=document.all(arrSel[i]).options[document.all(arrSel[i]).selectedIndex].text
     if(num==arrSel.length){//这里处理最后的数据。
      document.all("result").value="选中了("+arrTemp+")";return;
     }
     with(document.all(arrSel[num])){
      length=0
      var obj=document.all.xmldata.XMLDocument.childNodes[0];
      for(i=0;i<num;i++)obj=obj.selectSingleNode(arrSel[i]+'[@value="'+arrTemp[i]+'"]');
      for(i=0;i<obj.childNodes.length;i++)options[length++].text=obj.childNodes[i].getAttribute("value");
      onchange=new Function("qswhXml("+(num+1)+")");
      onchange();
     }
    }
    qswhXml(0);
    </script>
      

  3.   

    3.多级连动(三)
    <select name=one></select>
    <select name=two></select>
    <select name=three></select>
    <select name=four></select>
    <input name=result><script>
    var arrSel=["one","two","three","four"];//arrSel定义了要修改的下拉框
    var i=0,arrData=[];//arrData中搁的是数据,每条都显示各级的数据
    arrData[i++]=["2000","4","14","一点"]
    arrData[i++]=["2000","4","14","二点"]
    arrData[i++]=["2000","4","18","三点"]
    arrData[i++]=["2000","7","14","二点"]
    arrData[i++]=["2001","6","15","二点"]
    arrData[i++]=["2001","6","23","七点"]
    arrData[i++]=["2001","8","18","二点"]
    arrData[i++]=["2002","7","1","二点"]
    arrData[i++]=["2002","7","1","三点"]
    arrData[i++]=["2002","7","11","二点"]
    arrData[i++]=["2002","7","19","二点"]
    </script>
    <script>
    function qswhInit(num){
    /******* by qiushuiwuhen(2002-5-15) ********/
    var i,j,arrTemp=[];
    for(i=0;i<num;i++)arrTemp[i]=document.all(arrSel[i]).options[document.all(arrSel[i]).selectedIndex].text
    if(num==arrSel.length){//这里处理最后的数据。
    document.all("result").value="选中了("+arrTemp[0]+","+arrTemp[1]+","+arrTemp[2]+","+arrTemp[3]+")";return;
    }
    with(document.all(arrSel[num])){
    length=0
    for(i=0;i<arrData.length;i++){
    for(j=0;j<num;j++)if(arrTemp[j]!=arrData[i][j])break;
    if(j!=num)continue;
    if(length==0||options[length-1].text!=arrData[i][num])
    options[length++].text=arrData[i][num];
    }
    onchange=new Function("qswhInit("+(num+1)+")");
    onchange();
    }
    }
    qswhInit(0);//初始化
    </script>
      

  4.   

    asp.net里面用web service做,比较灵活,容易控制。