怎样实现两个下拉框之间的关联？

数据库中有两个类别表：一个大类表（shangpin1）一个小类表（shagnpin2）
我现在想实现的功能是：在一个下拉框中选择一个大类，对应的另外的一个下拉框出现的是和大类对应的内容。
类似与选择省出现城市；
  谢谢！！

解决方案 »

  1.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>连动菜单</title>
    <script type="text/javascript">
        var city=new Array();
    city[0]=["张家口","承德","廊坊","沧州","保定","衡水","邯郸","邢台","石家庄"];
    city[1]=["榆次","长治","大同"];
    city[2]=["淄搏","曲阜","青岛"];

    function getCity(provinceid){
    var objsel=document.getElementById("city");
    var pcity;
    objsel.options.length=0;
    pcity=city[provinceid];
    for(var i=0;i<pcity.length;i++){
    objsel.options[i]=new Option(pcity[i],pcity[i]);
    }
    }

    </script>
    </head>
    <body>
    <form id="form1" name="form1" method="post" action="">
      省
        <label>
      <select name="province" id="province" onchange="getCity(this.value)">
        <option value="0">河北</option>
        <option value="1">山西</option>
        <option value="2">山东</option>
      </select>
      市    </label>
      <label>
      <select name="city" id="city">
         <option value="-1">请选择城市</option>
      </select>
      </label>
    </form>
    </body>
    </html>
    按照上面的方法你可以做成n级连动
      

  2.   

    谢谢两位了软件人才，来http://www.sonatamanpower.com/utf/注册了吗？
      

  3.   

    set rs=server.createobject("adodb.recordset")
    sql = "select * from SmallClass order by SmallClassID asc"
    rs.open sql,conn,1,1
    %>
    <script language = "JavaScript">
    var onecount;
    subcat = new Array();
            <%
            count = 0
            do while not rs.eof 
            %>
    subcat[<%=count%>] = new Array("<%= trim(rs("SmallClassName"))%>","<%= trim(rs("BigClassName"))%>","<%= trim(rs("SmallClassName"))%>");
            <%
            count = count + 1
            rs.movenext
            loop
            rs.close
            %>
    onecount=<%=count%>;function changelocation(locationid)
        {
        document.addNEWS.SmallClassName.length = 1; 
        var locationid=locationid;
        var i;
        for (i=0;i < onecount; i++)
            {
                if (subcat[i][1] == locationid)
                { 
                    document.addNEWS.SmallClassName.options[document.addNEWS.SmallClassName.length] = new Option(subcat[i][0], subcat[i][2]);
                }        
            }
        }    
    </script>
    以下为BODY部分代码:
    <select name="BigClassName" onChange="changelocation(document.addNEWS.BigClassName.options[document.addNEWS.BigClassName.selectedIndex].value)" size="1">
                          <%
        do while not rs.eof
    %>
                          <option <% if rs("BigClassName")=rso("BigClassName") then response.Write("selected") end if%> value="<%=trim(rs("BigClassName"))%>"><%=trim(rs("BigClassName"))%></option>
                          <%
            rs.movenext
             loop
    end if
            rs.close
    %>
                        </select>
      

  4.   

    <%@ page language="java" contentType="text/html; charset=GB2312"
        pageEncoding="GB2312"%>
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
    <title></title>
    </head>
    <body>
    <script type="text/javascript">
    var city=new Array();
    city[0]=new Array("NewYork","LosAngel","Huston");
    city[1]=new Array("Shanghai","beijing","HongKong");
    city[2]=new Array("Tokyo","Kyoto","Nagoya");
    function getCity(cell)
    {
    var ct=document.getElementById("ct");
    var link;
    ct.options.length=0;
    link=city[cell];
    for(var i=0;i<link.length;i++)
    {
    ct.options[i]=new Option(link[i],link[i]);
    }


    }
    </script>
    请输入密码:
    <input type="password" onblur="check(this)">
    <select name="select" id="select" onchange="getCity(this.value)">
    <option value="-1">请选择国家</option>
    <option value="0">US</option>
    <option value="1">CH</option>
    <option value="2">JP</option>
    </select>
    <select name="ct" id="ct">
    <option value="-1">请选择城市</option>
    </select></body>
    </html>
      

  5.   

    第一个DDL绑定所有数据，选中时
    在DDL的selectChange 中选出该条件的数据绑定在DDL二中