Ajax + Asp实现级联菜单

本文介绍了一种使用Ajax和ASP技术实现动态级联列表框的方法。通过Ajax发送请求并接收XML响应,结合ASP连接数据库动态更新二级列表框的内容。此方案适用于需要根据一级列表框选择变化实时更新二级列表框选项的应用场景。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

<script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> </script>
http://www.corange.cn/archives/2008/03/788.html
在一些时候常常用到一个一级列表框(姑且这么叫)和一个二级列表框(姑且这么叫),二级列表框的选项随一级列表改变而改变,为了完成这个任务,其中一种就是用ajax+asp实现实现,代码如下:
一个Ajax 请求文件ajax_func.js放在ajax文件夹里:
var http_request = false;
function send_request(method,url,content,responseType,callback){
http_request = false;
if(window.XMLHttpRequest){
      http_request = new XMLHttpRequest();
        if(http_request.overrideMimetype){
         http_request.overrideMimetype("text/xml");
      }
}
else if (window.ActiveXObject) {
try{
http_request = new ActiveXObject("Msxml.XMLHTTP");
}catch(E){
try{
http_request = new ActiveXObject("Microsoft.XMLHTTP");
}catch(E){}
}
}
if (!http_request){
window.alert("不能创建XMLHttpRequest对象实例!");
}
if(responseType.toLowerCase()=="text"){
http_request.onreadystatechange = callback;
}
else if (responseType.toLowerCase()=="xml"){
http_request.onreadystatechange = callback;
}
else{
window.alert("响应类别参数错误!");
return false;
}
if(method.toLowerCase()=="get"){
http_request.open(method,url,true);
}
else if (method.toLowerCase()=="post"){
http_request.open(method,url,true);
http_request.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
}
else {
window.alert("http请求类别参数错误!");
return false;
}
http_request.send(content);
}
function processTextResponse(){
if(http_request.readyState==4){
      if (http_request.state == 200){
       alert("Text文档响应。");
      }else{
              alert("您所请求的页面有异常!");
              }
      }
}
function processXMLResponse(){
if(http_request.readyState==4){
      if (http_request.state == 200){
       alert("XML文档响应。");
      }else{
              alert("您所请求的页面有异常!");
              }
      }
}
一个连接数据库文件functiion.asp放在inc文件夹里:
'清空数据
Function QingKong(rs)
Set rs=Nothing
End Function
'关闭connection连接的数据库
Sub     guanconn()
conn.close
End Sub
'弹出对话框,及页面转向。
Function outmsg(massage,adress)
response.write""&Chr(13)
response.write""&Chr(13)
response.write""&Chr(13)
End Function
%>
数据库supernews.mdb放在文件夹data里,表设计为:
http://www.jinminghou.cn/download/images/63c9fb01393be8001d9583ef.jpg

生成XML文件为prov.asp,代码如下:
Dim prov
prov=request("id")
If prov="" Then 
outmsg "非法登入!","city.htm"
End If 
Dim conn,sql,rs,num
sql="select count(*) as num from tb_city where city_prov='"&prov&"'"
kaiconn
Set rs=conn.execute(sql)
num=rs("num")
%>
列表框页面代码为:
     
     
function clear(o){
l=o.length;
for (i = 0; i
if (prov=="")
{
return false;
}
send_request("get","prov.asp?id="+prov,null,"xml",chuli);
}
function chuli()
{
     if(http_request.readyState == 4)
      {
           if(http_request.status==200)
        {
       var oj=document.getElementById("city");
            clear(oj);
       var doc = http_request.responseXML;
   
var num=doc.getElementsByTagName("num")[0].firstChild.data;
      for (i=0;i
         }
      else
      {
      alert("你请求的页面异常!");
      }
}
}
     //-->
     
       
                                               省份
                                               北京市
                                               天津市
                                               河北省
                                               山西省
                                               内蒙古
                                               辽宁省
                                               吉林省
                                               黑龙江省
                                               上海市
                                               江苏省
                                               浙江省
                                               安徽省
                                               福建省
                                               台湾
                                               江西省
                                               山东省
                                               河南省
                                               湖北省
                                               湖南省
                                               广东省
                                               香港特别行政区
                                               澳门特别行政区
                                               广西壮族自治区
                                               海南省
                                               重庆市
                                               四川省
                                               贵州省
                                               云南省
                                               西藏自治区
                                               陕西省
                                               甘肃省
                                               青海省
                                               宁夏回族自治区
                                               新疆维吾尔族自治区  
                                          
       
城市
       
在IIS下运行( 必须在IIS下运行)效果如下:
http://www.jinminghou.cn/download/images/4b02ca22e4378af5d7cae2f5.jpg

http://www.jinminghou.cn/download/images/6b01aa19e522b07cdab4bdf6.jpg
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值