ajax access,ASP+AJAX+ACCESS数据库实例讲解三个步骤分享

看完本篇ajax实例教程，我相信你也可以轻松做出一个初级的AJAX应用。

你也可以直接访问：https://www.jb51.net/codes/57017.html 下载ajax教程的源码示例。

好，下面我们就始一步步让你了解AJAX+ASP基础应用，我们将分三步讲解，如下。

1. 前台AJAX代码(javascript)的创建。

2. 后台服务端ASP AJAX代码的编写。

3. ASP+AJAX+数据库的实例演示及讲解。

第一步：前台AJAX代码(javascript)的创建。

我们先创建一个index.html前台文件，内容代码如下：

AJAX教程实例-AJAX教程实例-ASP+AJAX+ACCESS数据库应用-脚本之家原创ajax实例教程

var xmlHttp

function showCustomer(str)

{

var url="getcustomer.asp?sid=" + Math.random() + "&q=" + str

xmlHttp=GetXmlHttpObject(stateChanged)

xmlHttp.open("GET", url , true)

xmlHttp.send(null)

}

function stateChanged()

{

if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")

{

document.getElementById("txtHint").innerHTML=xmlHttp.responseText

}

}

function GetXmlHttpObject(handler)

{

var objXmlHttp=null

if (navigator.userAgent.indexOf("Opera")>=0)

{

alert("This example doesn't work in Opera")

return;

}

if (navigator.userAgent.indexOf("MSIE")>=0)

{

var strName="Msxml2.XMLHTTP"

if (navigator.appVersion.indexOf("MSIE 5.5")>=0)

{

strName="Microsoft.XMLHTTP"

}

try

{

objXmlHttp=new ActiveXObject(strName)

objXmlHttp.onreadystatechange=handler

return objXmlHttp

}

catch(e)

{

alert("Error. Scripting for ActiveX might be disabled")

return

}

}

if (navigator.userAgent.indexOf("Mozilla")>=0)

{

objXmlHttp=new XMLHttpRequest()

objXmlHttp.οnlοad=handler

objXmlHttp.οnerrοr=handler

return objXmlHttp

}

}

请选择用户:

脚本之家.by.alixixi.com

哇塞网

收音机

网站信息...

ajax代码讲解：

关键代码为JS部分，其原理就是创建一个客户的Microsoft.XMLHTTP对象，来完成前台数据与服务端ASP的交互。

然后要注意的就是

这一行代码，原理就是通过showCustomer(this.value)触发AJAX的前台脚本对象，将用户在下拉列表选择的结果数据通过Microsoft.XMLHTTP发送到服务端处理，再返回到前台ID为txtHint的

用户信息...

层标签显示出来。

第二步：后台服务端ASP AJAX代码的编写。

创建完刚才的index.html，我们接着再创建一个getcustomer.asp文件，请确认你的ASP环境一切OK：)

getcustomer.asp的代码如下：

sql="SELECT * FROM CUSTOMERS WHERE CUSTOMERID="

sql=sql & request.querystring("q")

set conn=Server.CreateObject("ADODB.Connection")

conn.Provider="Microsoft.Jet.OLEDB.4.0"

conn.Open(Server.Mappath("ajaxjiaocheng.mdb"))

set rs = Server.CreateObject("ADODB.recordset")

rs.Open sql, conn

Response.CharSet = "GB2312"

if not rs.EOF then

response.write "

编号："&rs(0)&""

response.write "

名称："&rs(1)&""

response.write "

点击："&rs(2)&""

response.write "

介绍："&rs(3)&""

end if

rs.close

set rs = nothing

conn.close

set conn = nothing

%>

ajax代码讲解：

如果有asp基础的朋友一看就能明白，连接数据库代码及跟据前台发送过来的q参数查询相应的数据库结果：

sql="SELECT * FROM CUSTOMERS WHERE CUSTOMERID="

sql=sql & request.querystring("q")

set conn=Server.CreateObject("ADODB.Connection")

conn.Provider="Microsoft.Jet.OLEDB.4.0"

conn.Open(Server.Mappath("ajaxjiaocheng.mdb"))

set rs = Server.CreateObject("ADODB.recordset")

rs.Open sql, conn

接着要注意的就是这行代码：

Response.CharSet = "GB2312" ‘这句很关键，解决ajax中文乱码

很多人在使用AJAX过程中，经常都会遇到ajax中文显示变成乱码的问题，其实在ASP+AJAX应用中很容易解决这个问题，只需要在Response.Write语句输出中文内容前加入这行代码，就可以轻松解决ajax中文乱码问题。

继续讲解下段代码，就是显示相应的数据库查询结果，关闭数据库连接：

if not rs.EOF then

response.write "

编号："&rs(0)&""

response.write "

名称："&rs(1)&""

response.write "

点击："&rs(2)&""

response.write "

介绍："&rs(3)&""

end if

rs.close

set rs = nothing

conn.close

set conn = nothing

第三步：ASP+AJAX+数据库的实例演示及讲解

一路下来，代码非常精简明了。下面我们再附上数据库表的说明如下：

库名:ajaxjiaocheng.mdb

表名: Customers

字段1:CustomerID 自动编号

字段2:Name 文本格式

字段3:NL 数字格式

字段4:Address 文本格式

看到这里，不知道你是否能理解AJAX的工作原理？建议你动手一步步跟着本教程编写代码并进行测试。

本实例直观的说可以这样理解：

通过index.html页面上的 下拉列表选择触发JS代码中的showCustomer(this.value)事件，将选中的option值脚本之家

由以下的代码传递给ASP文件：

var url="getcustomer.asp?sid=" + Math.random() + "&q=" + str

xmlHttp=GetXmlHttpObject(stateChanged)

xmlHttp.open("GET", url , true)

xmlHttp.send(null)

ASP文件接收到q参数后，输出数据库相应的查询结果，然后js会检查asp的输出状态，如果输出完成后会把结果返回到index.html文件ID为txtHint的标签上。

在网络的世界里，我感觉自己无把不能。