这里是以省份和城市为例,由于用到数据库,请先建立数据库dlist.mdb
数据库名称:dlist.mdb
省份表名称:Province
字段有:p_id(类型:自动编号),p_name(类型:文本,省份名称)
城市表名称:City
字段有:c_id(类型:自动编号),c_pid(类型:文本,省份名称,等于Province表中的p_name),c_name(类型:文本,城市名称)
源程序如下,保存为ASP文件即可执行。
------------------------------------------------------------
<%
dim id
id=request.QueryString("id")
if id="1" then
response.Write "<br>" & request.Form("lstb")
response.Write "<br>" & request.Form("lsts")
end if
%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>JS动态列表示例</title>
<script language="JavaScript">
<!--
var sSort = new Array();
var num = 0;
<%
dim conn,rs,grs,i,j,pstr
pstr=""
set conn=server.createobject("adodb.connection")
set rs=server.createobject("adodb.recordset")
set grs=server.createobject("adodb.recordset")
conn.open "Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" & Server.mappath("dlist.mdb")
'写省份JS数组
rs.open "select * from province;",conn,1,1
for i=0 to rs.recordcount-1
pstr=pstr & "<option value=""" & rs("p_name") & """>" & rs("p_name") & "</option>"
getsub(rs("p_name"))
rs.movenext
next
rs.close()
set rs=nothing
set grs=nothing
'根据省份写城市JS数组的过程
sub getsub(pname)
grs.open "select * from city where c_pid='" & pname & "';",conn,1,1
for j=1 to grs.recordcount
response.write "sSort[num++] = new Array(""" & grs("c_name") & """ ,""" & pname & """);" & vbCrlf
grs.movenext
next
grs.close()
end sub
%>
var nsSortCount = num;
function sdbSortChange(cmbsdbSort, cmbsSort)
{
var nSelsdbSort = cmbsdbSort.selectedIndex;
var ssdbSort = cmbsdbSort.options[nSelsdbSort].value;
cmbsSort.length = 0;
cmbsSort.options[0] = new Option('-请选择-', '');
for(var i=0; i<nsSortCount; i++)
{
if(sSort[i][1] == ssdbSort)
{
cmbsSort.options[cmbsSort.length] = new Option(sSort[i][0], sSort[i][0]);
}
}
}
function InitsSort(cmbsdbSort, cmbsSort)
{
var nSelsdbSort = cmbsdbSort.selectedIndex;
var ssdbSort = cmbsdbSort.options[nSelsdbSort].value;
var ssSort = cmbsSort.options[0].value;
cmbsSort.length = 0;
cmbsSort.options[0] = new Option('-请选择-', '');
var n = 0;
for(var i=0; insSortCount; i++)
{
if(sSort[i][1] == ssdbSort)
{
cmbsSort.options[cmbsSort.length] = new Option(sSort[i][0], sSort[i][0]);
if(sSort[i][0] == ssSort)
cmbsSort.options[cmbsSort.length-1].selected = true;
}
}
}
//-->
</script>
</head>
<body>
<p> </p>
<p> </p>
<p> </p>
<form action="index.asp?id=1" method="post" name="frmdlist" id="frmdlist">
<table width="408" border="0" align="center" cellpadding="2" cellspacing="2">
<tr>
<td width="400" align="center">JS动态列表示例</td>
</tr>
<tr>
<td align="center"><%response.write "<select name=""lstb"" style=""width:200"" onChange=""sdbSortChange(this,frmdlist.lsts);"">" & pstr & "</select>"%>
</td>
</tr>
<tr>
<td align="center"> </td>
</tr>
<tr>
<td align="center"><select style="width:200" name="lsts" id="lsts">
</select>
</td>
</tr>
</table>
<p align="center">
</p>
<p align="center"> </p>
<p align="center">
<input type="submit" name="Submit" value="提交">
</p>
</form>
</body>
</html>