问题:
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