怎样实现两个DropDownList互联

    今天需要写一个两个DropDownList互联的程序。捣鼓了半天，总算实现出来了，另外，也对Javascript中的对象属性没有提示，帮助少，莫名奇妙的错误深恨之。
    
        程序是用ASP+Javascript实现的，ASP代码可以嵌套在Javascript的作用域中，如下所示：
   

<script language="javascript">
  <%
     dim conn,rs
     conn="MyConn";
     rs="MyRs";
  %>
var Conn = <%=conn%> //这种实现是可以的
</script>

        实现双DropDownList互联需要借助Javascript中的数组实现，先定义数组，这里只是固定的写了几个数组，一般情况下，可根据需要用asp代码来实现：
       

<script language="javascript">
var onecount = 6;
var subcat    =    new Array();
subcat[0] = new Array("8","信息发布平台","1","今日焦点");
subcat[1] = new Array("8","信息发布平台","2","专题播报");
subcat[2] = new Array("8","信息发布平台","3","业界动态");
subcat[3] = new Array("16","产品发布平台","4","产业信息");
subcat[4] = new Array("16","产品发布平台","5","视觉商城");
subcat[5] = new Array("19","会议论坛","6","会议主题");
</script>

    Html页面上有两个DropDownList，在代码中我是用ASP来动态增加实现的，在这里为了表达清晰，就真接写出option选项，如下所示：

<select name="FClassSelect" onChange="changelocation(document.form2.FClassSelect.options[document.form2.FClassSelect.selectedIndex].value)">
<option value='8'>信息发布平台</option>
<option value='16'>产品发布平台</option>
<option value='17'>会展服务平台</option>
<option value='19'>会议论坛</option>
</select>

<select name="FClass_Select2" id="DropDownField2">
</select>

        可以看出，第二个DropDownList是没有option的，是根据FClassSelect的选择来往DropDownField2中添加option,在FClassSelect的OnChange事件中，有下个changelocation函数，它就是往DropDownField2中添加相应的option。
        函数的实现：

function changelocation(SClass_Id)
{
    var optionlength=document.form2.FClass_Select2.options.length;
    for(i=0;i<optionlength;i++)
        document.form2.FClass_Select2.remove(0); //不能用remove(i),因为删掉一个之后，后一个Index自动变成0
    
    for(i=0;i<onecount;i++)
    {
        if(subcat[i][0]==SClass_Id)
        {
            var newOpt=window.document.createElement("option");
            newOpt.text=subcat[i][3];
            newOpt.value=subcat[i][2];
               window.document.form2.FClass_Select2.options.add(newOpt);
        }
    }
}

        OK，这样就实现了在两个DropDownList之间的互联，但是还是有一个问题 ，就是页面刚载入的时候，第二个DropDownList是绝对不会有任何选项的，必须要第一个DropDownlist中点另外一个，再点回来，才能显示出与它关联的选项。这个办法也好解决，只要在第二个DropDownList的HTML后面调用一次changelocation即可，如下：

<select name="FClass_Select2" id="DropDownField2">
</select>

    <script language="javascript">
    changelocation(subcat[0][0]);
   </script>

下面是我项目中的程序：

<script language="javascript">
<%
    dim conn2,rs2
    call OpenConnRS(conn2,rs2)
    rs2.open "SELECT * from FClass,SClass where FClass.FClass_ID=SClass.SClass_FClass_ID",conn2,1,1
%>
var onecount = <%=rs2.recordcount%>;
var subcat    =    new Array();
<%
    count=0
    do while not rs2.eof
%>
subcat[<%=count%>] = new Array("<%=trim(rs2("FClass_ID"))%>","<%=trim(rs2("FClass_Title"))%>","<%=trim(rs2("SClass_ID"))%>","<%=trim(rs2("SClass_Title"))%>");
<%
    count=count+1
    rs2.movenext
    loop
    rs2.close
    conn2.close
%>


function changelocation(SClass_Id)
{
    var optionlength    =    document.form2.FClass_Select2.options.length;
    for(i=0;i<optionlength;i++)
        document.form2.FClass_Select2.remove(0);
    
    for(i=0;i<onecount;i++)
    {
        if(subcat[i][0]==SClass_Id)
        {
            var newOpt=window.document.createElement("option");
            newOpt.text=subcat[i][3];
            newOpt.value=subcat[i][2];
               window.document.form2.FClass_Select2.options.add(newOpt);
        }
    }
}
</script>


<select name="FClassSelect" onChange="changelocation(document.form2.FClassSelect.options[document.form2.FClassSelect.selectedIndex].value)">
          <%
              rs.open "Select * from FClass",conn,1,1
            for i=1 to rs.recordcount
                Response.Write("<option value='"&rs("FClass_Id")&"'>"&rs("FClass_Title")&"</option>")
                rs.movenext
            next
            rs.close()
          %>
          </select>
            <select name="FClass_Select2" id="FClass_Select2" >
            </select>
            <script language="javascript">
                changelocation(subcat[0][0]);
            </script>