select

来源：互联网发布：电脑所有软件打不开编辑：程序博客网时间：2024/05/21 15:41

    var locationid=locationid;
    var i;
    for (i=0;i < onecount; i++)
        {
            if (subcat[i][1] == locationid)
            {
                document.form1.select2.options[document.form1.select2.length] = new Option(subcat[i][0], subcat[i][2]);
            }
        }
    }
</script>
<form name="form1">
<select style="width:90" name='select1' onChange='changelocation(document.form1.select1.options[document.form1.select1.selectedIndex].value)' size='1'>
<option value=>请选择</option>
    <option value='A'>A</option>
<option value='B'>B</option>
<option value='C'>C</option>
</select>
<select name='select2' style="width:90">
</select></form>

以下代码放在页面test.jsp中，测试时修改数据库连接及提取数据部分即可。

<%@page contentType="text/html;charset=gb2312"%>
<%@page import="java.sql.*"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>多选三级级联菜单</title>
</head>
<%
/**
假设表table有以下字段：地区area，省份province，城市city
*/
%>
<body style="margin-top:0px;margin-left:0px;margin-right:0px;margin-bottom:5px">
<form action="" method="post" style="margin:0" name="dataForm">
<table align="CENTER" cellspacing="0" cellpadding="0" width="100%" >
<tr>
   <td valign="MIDDLE" >
   一级列表：<br/>
      <select multiple name="st1" size="5" onchange="corpChoose1()">
      <%
Class.forName("oracle.jdbc.driver.OracleDriver").newInstance();
String url="jdbc:oracle:thin:@localhost:1521:orcl";
//orcl为你的数据库的SID
String user="scott";
String password="tiger";
Connection conn= DriverManager.getConnection(url,user,password);
Statement stmt1=conn.createStatement(ResultSet.TYPE_SCROLL_INSENSITIVE,ResultSet.CONCUR_READ_ONLY);
Statement stmt2=conn.createStatement(ResultSet.TYPE_SCROLL_INSENSITIVE,ResultSet.CONCUR_READ_ONLY);
Statement stmt3=conn.createStatement(ResultSet.TYPE_SCROLL_INSENSITIVE,ResultSet.CONCUR_READ_ONLY);

String st2valueStr="";
String st2optionStr="";
String st3valueStr="";
String st3optionStr="";

ResultSet rs1=stmt1.executeQuery("select distinct area from table_1");
ResultSet rs2=null;
ResultSet rs3=null;

while (rs1.next()) {
  rs2=stmt2.executeQuery("select distinct province from table_1 where area='"+rs1.getString(1)+"'");
  while (rs2.next()) {
   st2valueStr=st2valueStr+rs2.getString(1)+",";
   st2optionStr=st2optionStr+rs2.getString(1)+",";
   rs3=stmt3.executeQuery("select city from table_1 where province='"+rs2.getString(1)+"'");
    while (rs3.next()) {
     st3valueStr=st3valueStr+rs3.getString(1)+",";
     st3optionStr=st3optionStr+rs3.getString(1)+",";
    }
    st3valueStr=st3valueStr.substring(0,st3valueStr.length() - 1)+";";
    st3optionStr=st3optionStr.substring(0,st3optionStr.length() - 1)+";";
  }
  st2valueStr=st2valueStr.substring(0,st2valueStr.length() - 1)+";";
  st2optionStr=st2optionStr.substring(0,st2optionStr.length() - 1)+";";
  st3valueStr=st3valueStr.substring(0,st3valueStr.length() - 1)+"#";
  st3optionStr=st3optionStr.substring(0,st3optionStr.length() - 1)+"#";
      %>
    <option value="<%=rs1.getString(1)%>"><%=rs1.getString(1)%></option>
    <%
}

if (st2valueStr.length()>0)
{
  st2valueStr = st2valueStr.substring(0,st2valueStr.length() - 1);
}else{
  st2valueStr = "";
}
if (st2optionStr.length()>0)
{
  st2optionStr = st2optionStr.substring(0,st2optionStr.length() - 1);
}else{
  st2optionStr = "";
}
if (st3valueStr.length()>0)
{
  st3valueStr = st3valueStr.substring(0,st3valueStr.length() - 1);
}else{
  st3valueStr = "";
}
if (st3optionStr.length()>0)
{
  st3optionStr = st3optionStr.substring(0,st3optionStr.length() - 1);
}else{
  st3optionStr = "";
}

stmt1.close();
stmt2.close();
stmt3.close();
conn.close();
      %>
      </select>
   </td>
   <td valign="MIDDLE" width="">
      二级列表：<br/>
      <select multiple name="st2" size="10" onchange="corpChoose2()">
      </select>
   </td>
   <td valign="MIDDLE">
   三级列表：<br/>
  <select multiple name="st3" size="10" >
  </select>
   </td>

</tr>
</table>
</form>
<script>
function corpChoose1()
{
//生成二级菜单

dataForm.st2.length = 1;
var value = "<%=st2valueStr%>".split(";");
var option = "<%=st2optionStr%>".split(";");
var valuePP = "";
var optionPP = "";
var valueA="",optionA="";
var aa=0;
for (var j=0;j<dataForm.st1.length;j++)
{
if (dataForm.st1.options[j].selected)
{
   if(aa>0){
    valueA=valueA+","+value[j];
    optionA=optionA+","+option[j];
   }else{
    valueA=value[j];
    optionA=option[j];
   }
   aa++;
}
}
valuePP = valueA.split(",");
optionPP = optionA.split(",");

dataForm.st2.length = optionPP.length;
dataForm.st2.options[0].text ="请选择";
dataForm.st2.options[0].value = "";
for (var jj = 0;jj<optionPP.length;jj++)
{
dataForm.st2.options[jj].text = optionPP[jj];
dataForm.st2.options[jj].value = valuePP[jj];
}
}
function corpChoose2()
{
//生成三级菜单
dataForm.st3.length = 1;
var value = "<%=st2valueStr%>".split(";");
var option = "<%=st2optionStr%>".split(";");
var valuePP = "";
var optionPP = "";
var st3valueA="",st3optionA="";
var aa=0,bb=0;
var st3value = "<%=st3valueStr%>".split("#");
var st3option = "<%=st3optionStr%>".split("#");

for (var i=0;i<dataForm.st1.length;i++)//一级菜单
{
var option1=option[i].split(",");
var value1=value[i].split(",");
var st3option1=st3option[i].split(";");
var st3value1=st3value[i].split(";");
if (dataForm.st1.options[i].selected)//判断是否被选中
{
   for(var j=0;j<option1.length;j++){//二级菜单
    var st3option2=st3option1[j].split(",");
    var st3value2=st3value1[j].split(",");
    for (var k=0;k<dataForm.st2.length;k++){ //循环判断是否被选中
     if (dataForm.st2.options[k].selected && dataForm.st2.options[k].value==value1[j])
     {
      for(var l=0;l<st3option2.length;l++){//三级菜单
       if(bb>0){
        st3valueA=st3valueA+","+st3value2[l];
        st3optionA=st3optionA+","+st3option2[l];
       }else{
        st3valueA=st3value2[l];
        st3optionA=st3option2[l];
       }
       bb++;
      }
     }
    }
   }
}
}

var st3valuePP = st3valueA.split(",");
var st3optionPP = st3optionA.split(",");
dataForm.st3.length = st3optionPP.length;

for (var jj = 0;jj<st3optionPP.length;jj++)
{
dataForm.st3.options[jj].text = st3optionPP[jj];
dataForm.st3.options[jj].value = st3valuePP[jj];
}
}
corpChoose2();
corpChoose1();
</script>
</body>
</html>