var searchReq=createAjaxObj();
var formname=""; function createAjaxObj()
{
var httprequest=false;
if(window.XMLHttpRequest)
{
httprequest=new XMLHttpRequest();
if(httprequest.overrideMimeType)
httprequest.overrideMimeType('text/xml');
}
else if (window.ActiveXObject)
{
//IE
try
{
httprequest=new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
try
{
httprequest=new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e)
{
}
}
}
return httprequest
}/*f0表单名
't 表名
'f1字段名
'f2字段名
'id条件,即要传的值
'w条件字段名
'o顺序字段名*/
function search(f0,t,f1,f2,id,w,o)
{
formname=f0;
url="search.asp?t="+t+"&f1="+f1+"&f2="+f2+"&id="+id+"&w="+w+"&o="+o+"&m=" + new Date().getTime();
searchReq.open("get",url);
searchReq.onreadystatechange=handleSearchSuggest;
searchReq.send(null);
}function handleSearchSuggest()
{
if(searchReq.readyState==4)
{
switch(formname)
{
case "area":
{
document.getElementById("area").options[0]=new Option("请选择","0");
document.getElementById("area").options.selected=true;
document.getElementById("area").length=1;
}
case "province":
{
document.getElementById("province").options[0]=new Option("请选择","0");
document.getElementById("province").options.selected=true;
document.getElementById("province").length=1;
}
case "city":
{
document.getElementById("city").options[0]=new Option("请选择","0");
document.getElementById("city").options.selected=true;
document.getElementById("city").length=1;
}
case "school":
{
document.getElementById("school").options[0]=new Option("请选择","0");
document.getElementById("school").options.selected=true;
document.getElementById("school").length=1;
}
case "college":
{
document.getElementById("college").options[0]=new Option("请选择","0");
document.getElementById("college").options.selected=true;
document.getElementById("college").length=1;
}
case "Professional":
{
document.getElementById("Professional").options[0]=new Option("请选择","0");
document.getElementById("Professional").options.selected=true;
document.getElementById("Professional").length=1;
}
}
switch (formname)
{
case "area":name="Bore";break;
case "province":name="style";break;
case "city":name="Stroke";break;
case "school":name="Shaft";break;
case "college":name="series";break;
case "Professional":name="专业";break;
}
xmldoc=searchReq.responseXML;
var message_nodes=xmldoc.getElementsByTagName("message");
var n_messages=message_nodes.length;
if (n_messages<=0)
{
document.getElementById(formname).options[0]=new Option("请选择"+name,"0");
document.getElementById(formname).options.selected=true;
document.getElementById(formname).length=1;
}
else
{
document.getElementById(formname).options[0]=new Option("请选择"+name,"0");
for (i=0;i<n_messages;i++ )
{
var cid=message_nodes[i].getElementsByTagName("cid")[0].firstChild.data;
var name=message_nodes[i].getElementsByTagName("name")[0].firstChild.data;
document.getElementById(formname).options[i+1]=new Option(name,cid);
}
document.getElementById(formname).options.selected=true;
document.getElementById(formname).length=i+1; }
}
else
{
//alert('网络连接失败');
}
}
当我选择series选项的时候...在专业显示就不是下拉菜单了...而是series所对专业选项的内容显示出来...可能有多个字段对series的ID要显示出来前台代码如下:<!-- #include file="include/adoconn.asp" --><table width="200" border="1">
<form action="" method="post" name="form1">
<script src="search.js" language="javascript"></script> <tr>
<td>Bore</td>
<td><select name="area" id="area" onchange='search("province","province","province_id","province_name",this.value,"area_id","province_order")'>
<option>请选择</option>
<%
sql="select area_id,area_name from area order by area_order asc"
rs.open sql,conn,1,1
If rs.eof Then
Else
do while not rs.eof
area_id = rs("area_id")
area_name = rs("area_name")
'******************下面是你要显示的******************'
response.write "<option value="""&area_id&""">"&area_name&"</option>"
'******************上面是你要显示的******************'
rs.movenext
loop
End If
rs.close %>
</select></td>
</tr>
<tr>
<td>style</td>
<td><select name="province" id="province" onchange='search("city","city","city_id","city_name",this.value,"province_id","city_order")'>
<option>请选择</option>
</select></td>
</tr>
<tr>
<td>Stroke</td>
<td><select name="city" id="city" onchange='search("school","school","school_id","school_name",this.value,"city_id","school_order")'>
<option>请选择</option>
</select></td>
</tr>
<tr>
<td>Shaft</td>
<td><select name="school" id="school" onchange='search("college","college","college_id","college_name",this.value,"school_id","college_order")'>
<option>请选择</option>
</select></td>
</tr>
<tr>
<td>series</td>
<td>
<select name="college" id="college" onchange='search("Professional","Professional","Professional_id","Professional_name",this.value,"college_id","Professional_order")'>
<option>请选择</option>
</select></td>
</tr>
<tr>
<td>专业</td>
<td>
<select name="Professional" id="Professional">
<option>请选择</option>
</select>
</td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
</form></table>
<p> </p>我已经没有分了..只能出的起这么多了高手帮帮忙
dropdownlist.bind();绑定完成了，在选择的时候做触发，触发后后台在绑定，这样也可实现级联关系的动态绑定，感觉比纯js写容易些。确定就是页面整体刷新，用scriptmanager后可解决此问题
www.it63.net
共同进步