用javascript实现下拉列表框的问题

利用数组做菜单连动的例子
你可以用数据库中的数据来动态生成arrSelect，就可以实现你的要求了<script language="JavaScript">
var arrSelect1 = new Array(2);
var arrSelect2 = new Array(4);
var arrSelect3 = new Array(8);
var arrSelect4 = new Array(16);
var i;for (i = 0; i <= arrSelect1.length - 1; i ++) {
arrSelect1[i] = new Array(3);
arrSelect1[i][0] = "select1 value" + i;
arrSelect1[i][1] = "select1 text" + i;
arrSelect1[i][2] = -1;
}for (i = 0; i <= arrSelect2.length - 1; i ++) {
arrSelect2[i] = new Array(3);
arrSelect2[i][0] = "select2 value" + i;
arrSelect2[i][1] = "select2 text" + i;
arrSelect2[i][2] = i % 2;
}for (i = 0; i <= arrSelect3.length - 1; i ++) {
arrSelect3[i] = new Array(3);
arrSelect3[i][0] = "select3 value" + i;
arrSelect3[i][1] = "select3 text" + i;
arrSelect3[i][2] = i % 4;
}for (i = 0; i <= arrSelect4.length - 1; i ++) {
arrSelect4[i] = new Array(3);
arrSelect4[i][0] = "select4 value" + i;
arrSelect4[i][1] = "select4 text" + i;
arrSelect4[i][2] = i % 8;
}function clearOption(select) {
for (i = select.length - 1; i >= 0; i --) {
select.remove(i);
}
}
function changeOption1() {
var i, oOption clearOption(document.formname.select1);
for (i = 0; i <= arrSelect1.length - 1; i ++) {
oOption = document.createElement("OPTION");
oOption.value = arrSelect1[i][0];
oOption.text = arrSelect1[i][1];
document.formname.select1.add(oOption);
}
document.formname.select1.selectedIndex = -1;
changeOption2();
}
function changeOption2() {
var i, iSelect, oOption;

clearOption(document.formname.select2);
iSelect = -1;
for (i = 0; i <= arrSelect1.length - 1; i ++) {
if (arrSelect1[i][0] == document.formname.select1.value) {
iSelect = i;
break;
}
}
for (i = 0; i <= arrSelect2.length - 1; i ++) {
if (arrSelect2[i][2] == iSelect) {
oOption = document.createElement("OPTION");
oOption.value = arrSelect2[i][0];
oOption.text = arrSelect2[i][1];
document.formname.select2.add(oOption);
}
}
document.formname.select2.selectedIndex = -1;
changeOption3();
}
function changeOption3() {
var i, iSelect, oOption;

clearOption(document.formname.select3);
iSelect = -1;
for (i = 0; i <= arrSelect2.length - 1; i ++) {
if (arrSelect2[i][0] == document.formname.select2.value) {
iSelect = i;
break;
}
}
for (i = 0; i <= arrSelect3.length - 1; i ++) {
if (arrSelect3[i][2] == iSelect) {
oOption = document.createElement("OPTION");
oOption.value = arrSelect3[i][0];
oOption.text = arrSelect3[i][1];
document.formname.select3.add(oOption);
}
}
document.formname.select3.selectedIndex = -1;
changeOption4();
}
function changeOption4() {
var i, iSelect, oOption;

clearOption(document.formname.select4);
iSelect = -1;
for (i = 0; i <= arrSelect3.length - 1; i ++) {
if (arrSelect3[i][0] == document.formname.select3.value) {
iSelect = i;
break;
}
}
for (i = 0; i <= arrSelect4.length - 1; i ++) {
if (arrSelect4[i][2] == iSelect) {
oOption = document.createElement("OPTION");
oOption.value = arrSelect4[i][0];
oOption.text = arrSelect4[i][1];
document.formname.select4.add(oOption);
}
}
document.formname.select4.selectedIndex = -1;
}
</script>
<body onload="changeOption1();">
<form name="formname">
<select name="select1" style="width:150px" onchange="changeOption2()"></select><br>
<select name="select2" style="width:150px" onchange="changeOption3()"></select><br>
<select name="select3" style="width:150px" onchange="changeOption4()"></select><br>
<select name="select4" style="width:150px"></select><br>
</form>
</body>

解决方案 »

  1.   

    <object classid="clsid:333C7BC4-460F-11D0-BC04-0080C7055A83" id="DataSource" VIEWASTEXT>
    <param NAME="UseHeader" VALUE="True"> 
    <param NAME="FieldDelim" VALUE=","> 
    </object> 
    查一下这个最象的用法。是一个TDC控件。如需要详细说明，及程序事例，可写信给我
    这个控件主要是把数据库的内容保存成文本并对数据进行操作的。我的E_Mail:
    [email protected]
      

  2.   

    如果是数据库动态查询,你可以通过select的onchange事件,将选择的结果提交到一个iframe里,然后由iframe里来处理,并将查询的结果返回到select里!!一切就OK了!! 
      

  3.   

    这里有我做过的一个列子：
    <SCRIPT LANGUAGE=javascript>
    <!--
    var bmmc=new Array();
    var bmdm=new Array();
    var maxlen;
    //-->
    </SCRIPT>
    <%
    conn=dbconn()
    set rs=Server.CreateObject("ADODB.RecordSet")
    sql="SELECT bmmc,bmdm FROM bmgzb where right(left(bmdm,6),2)='00'"
    rs.Open sql,conn,1,1
    for i=1 to rs.RecordCount 
    %>
    <SCRIPT LANGUAGE=javascript>
    <!--
    maxlen=<%=rs.RecordCount%>;
    bmmc[<%=i-1%>]='<%=rs.Fields("bmmc")%>';
    bmdm[<%=i-1%>]='<%=rs.Fields("bmdm")%>';
    //-->
    </SCRIPT>
    <%
    rs.MoveNext 
    next 
    rs.Close
    %>
    <SCRIPT LANGUAGE=javascript>
    <!--
    function left(s,n){
    return(s.substr(0,n));
    }function init(shengObj,shiObj){
    shengObj.options[0]=new Option("--全国--","all");
    shiObj.options[0]=new Option("--全省--","all");
    for (var i=0;i<40;i++)  shengObj.remove(1);
    for (var i=0;i<40;i++)  shiObj.remove(1);
    shiObj.options[0].selected=true;
    for(i=0;i<maxlen;i++)
       if((bmdm[i]).substr(2,4)=="0000")
           shengObj.add(new Option(bmmc[i],bmdm[i]));
    shengObj.options[0].selected=true;}function shengOnchange(shengObj,shiObj){
    value=shengObj.value;
    for (var i=0;i<40;i++)  shiObj.remove(1);
    for(i=0;i<maxlen;i++)
     if(value.substr(0,2)==(bmdm[i]).substr(0,2) && (bmdm[i]).substr(2,4)!="0000")
        shiObj.add(new Option(bmmc[i],bmdm[i]));
    }function window_onload() {
    init(form1.sheng,form1.shi);
    }function sheng_onchange() {
    shengOnchange(form1.sheng,form1.shi);
    }
    //-->
    </SCRIPT><TABLE WIDTH="100%" border=0 height=50 cellpadding=2 cellspacing=2>
              <TR> 
                <TD> 
                  <P align=center><FONT color=red><STRONG>
                    <SELECT id=sheng 
                name=sheng style="WIDTH: 100px" LANGUAGE=javascript onchange="return sheng_onchange()">
                      <OPTION 
                selected></OPTION>
                    </SELECT>
                    省
                    <SELECT id=shi name=shi 
                style="WIDTH: 100px">
                      <OPTION selected></OPTION>
                    </SELECT>
                    市 
                    </STRONG></FONT></P>
                </TD>
              </TR>
            </TABLE>