Jsp中使用select的聯動

問題：

a表
Code               Name
0001               公司1
0002               公司2
b表
MainCode             SubCode               SubName
0001                       1001                       部門1
0001                       1002                       部門2
0002                       2001                       部門3
0002                       2002                       部門4

2個select。第一個select如果選擇公司1，那麼第二個select就是和它主代碼相同的部門1，部門2
類似於，很多註冊網站中如果一個select選擇“山東”，另一個就是山東的所有地市。如果選擇“山西”。另一個就動態是山西的所有地市。

解決方案1：

<script   language   =   "JavaScript ">
var   onecount;
onecount=0;
subcat   =   new   Array();
<%
int   count   =   0;
java.sql.ResultSet   rs1   =   DBManage.executeQuery( "select   hydm,zhydm,zhymc   from   zhy   ");//讀取資料
while(rs1.next())
{
String   selhydm=rs1.getString( "hydm ").trim();
String   zhydm=rs1.getString( "zhydm ").trim();
String   zhymc=rs1.getString( "zhymc ").trim();  
%>
subcat[ <%=count%> ]   =   new   Array( " <%=zhydm%> ", " <%=selhydm%> ", " <%=zhymc%> ");//產生數組
<%
count   =   count   +   1;
}
if(rs1!=null)   DBManage.closeCOnn();
%>
onecount= <%=count%> ;
function   changelocation(id)
{
document.form1.selzhy.length   =   0;  
var   hydm=id;
var   i;
document.form1.selzhy.options[0]   =   new   Option( '選擇子行業分類 ', ' ');
for   (i=0;i   <   onecount;   i++)
{
if   (subcat[i][1]   ==   hydm)
{  
document.form1.selzhy.options[document.form1.selzhy.length]   =   new   Option(subcat[i][2],   subcat[i][0]);
}                
}
}  
</script>
<table   width= "500 "     border= "0 "   cellspacing= "0 "   cellpadding= "0 "   align= "center ">
<tr>
<td   width= "180 "   height= "20 "   align= "right "> 選擇行業分類: </td>
<td   width= "320 ">
<select   name= "selhy "   onChange= "changelocation(document.form1.selhy.options[document.form1.selhy.selectedIndex].value) "   size= "1 "   >
<option   value= "2 "> 請選擇行業分類 </option>
<%
rs   =   DBManage.executeQuery( "select   *   from   hy ");
while(rs.next())
{
        String   hydm=rs.getString( "hydm ").trim();
        String   hymc=rs.getString( "hymc ").trim();
%>
<option   value= " <%=hydm%> "> <%=hymc%> </option>
<%
}
if(rs!=null)   DBManage.closeCOnn();
%>
</select>
</td>
</tr>
<tr>
<td   height= "20 "   align= "right "> 選擇子行業分類: </td>
<td>
<select   name= "selzhy "   >
<option   value= " "   selected> 請選擇子行業分類 </option>
</select>  
</td>
</tr>
</table>

解決方案2：

<form     name=form1>    
<select     name=province     onchange= "cityName(this.selectedIndex) ">    
      <option     value= " "> 請選擇省名 </option>    
</select>    
 
<select     name=city>    
      <option     value= " "> 請選擇城名 </option>    
</select>    
</form>    
 
<script     language=javascript>    
 
var     city1     =     [ "杭州 ",     "寧波 ",     "溫州 ",     "紹興 ",     "金華 ",     "湖州 "];    
var     city2     =     [ "南京 ",     "蘇州 ",     "無錫 ",     "常州 ",     "鎮江 ",     "徐州 "];    
var     city3     =     [ "合肥 ",     "翕縣 ",     "黃山 ",     "祁門 ",     "休寧 "];    
var     city4     =     [ "南昌 ",     "九江 ",     "贛州 ",     "上饒 ",     "新喻 ",     "景德鎮 "];        
var     provinceName     =     [ "浙江 ",     "江蘇 ",     "安徽 ",     "江西 "];    
 
 
function     province()    
{    
 
              var     e     =     document.form1.province;    
              for     (var     i=0;     i <provinceName.length;     i++)    
                          e.options.add(new     Option(provinceName[i],     provinceName[i]));    
}    
function     cityName(n)    
{    
              var     e     =     document.form1.city;    
              for     (var     i=e.options.length;     i> 0;     i--)         e.remove(i);    
              if     (n     ==     0)     return;    
              var     a     =     eval( "city "+     n);     //得到城市的數組名    
              for     (var     i=0;     i <a.length;     i++)     e.options.add(new     Option(a[i],     a[i]));    
}    
function     window.onload()    
{    
              province();     //初始時給省名下拉式功能表賦內容    
}    
</script>

總結：

靜態實現，可以利用javascript的級聯select，這裡有個很好的封裝類與樣本：http://www.mattkruse.com/javascript/dynamicoptionlist/；還有這裡，另一個樣本：http://www.chinabs.net/js/listdropdownmenu.asp
動態實現，可以利用XML到後台去動態取值，網上也可以搜到相應的例子；

後者主要是為瞭解決資料量較大的情況下Load時間過慢的問題。根據當前的需求，前者應該就可以滿足要求了。