index.html(主要功能是显示两个文本框,用来输入用户名和密码)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>Ajax简单实例</title>
</head>

<body><script src=comm.js></script>
用户名:
<input type=text name=username οnblur="checkName(this.value)" value=""><span id="txtUser"></span><br/>
密&nbsp; 码:
<input type=password name=password value=""><br/>
<input type="button" οnclick="addpost()" value="提交" />

<div id="messager"></div>

</body>
</html>

 

comm.js(主要的Ajax技术,请注意里面的大小写)

if(window.XMLHttpRequest){//IE
ajax=new XMLHttpRequest();
}
else if(window.ActiveXObject)
{
ajax=new ActiveXObject("Microsoft.XMLHTTP");
}

function loading(divnamestr){
errhtml="加载失败,请重新再试"
okhtml="数据正在处理中"
if(ajax.readyState==4){
       if(ajax.status==200) {
     document.getElementById(""+divnamestr+"").innerHTML=okhtml;
     }else{
     document.getElementById(""+divnamestr+"").innerHTML=errhtml;
     return false;
    }
}
}

//检查用户名是否重复
function checkName(username){
   var strurl="username="+username;
   ajax.open("POST","checkAsp.asp",false);
   ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
   ajax.send (strurl);//提交发送
   ajax.onreadystatechange=function(){loading("txtUser");}// 处理返回信息的函数
   document.getElementById("txtUser").innerHTML=unescape(ajax.responseText);//返回ASP执行回的信息

}

//添加用户
function addpost(){
document.getElementById("messager").innerHTML="请稍后"; //
var strusername=document.getElementById("username").value;//取出username表单里的值
var strpassword=document.getElementById("password").value;//取出password表单里的值
var strurl="username="+escape(strusername)+"&password="+escape(strpassword)+"&time="+new Date().getTime();
//定义提交的数据,为了防止被缓存,后面加上时间,这样提交的URL才会是唯一的。为了防止出现乱码,用escape把他编码转换。到ASP中再用unescape
ajax.open ("POST","save.asp",false); //以POST的方式提交,一定要大写,不然在FOXIE下无法认证,save.asp是处理的程序,false这个是同步提交
ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded");//
ajax.send (strurl);//提交发送
ajax.onreadystatechange=function(){loading("messager");}// 处理返回信息的函数
document.getElementById("messager").innerHTML=unescape(ajax.responseText);//返回ASP执行回的信息
}

 

checkAsp.asp(用来检查用户名是否重复)

<!--#include file="conn.asp"-->
<%
dim username
dim repeatName
dim html
username=unescape(request("username"))'将编译后的信息转回来

repeatName=false
set rs=server.CreateObject("adodb.recordset")
sql="select * from table_user where loginname='"&username&"'"
rs.open sql,conn,1,1
do while not rs.eof
repeatName=true
   rs.movenext
loop

if(repeatName) then
   html="<span style='color:red;'>此用户已经注册!</span>"
else
   html="<span style='color:green;'>此用户名可以使用!</span>"
end if

response.Write (escape(html))
rs.close
set rs=nothing
%>

 

save.asp(用来保存用户和密码信息)

<!--#include file="conn.asp"-->

<%
dim username,password '定义变量
on error resume next '容错处理
username=unescape(request("username"))'将编译后的信息转回来
password=unescape(request("password"))

set rs=server.CreateObject("adodb.recordset")
sql="select top 1 * from table_user order by id desc"
rs.open sql,conn,1,3
rs.addnew
rs("loginname")=username
rs("pwd")=password
rs.update
rs.close

if error then '当处理失败时
     html="添加失败"
else '相反也就是成功后
     html="添加成功"
end if
response.write escape(html) '输出处理后的信息,并将他转换成编码,在JS用unescape

%>

conn.asp(字符串连接字符)

<%
dim p1
dim conn
Provider = "Provider=Microsoft.Jet.OLEDB.4.0;"
Path = "Data Source=" & Server.MapPath("Database.mdb")
Set conn= Server.CreateObject("ADODB.Connection")
p1=Provider&Path
conn.Open p1
%>

 

table_user(数据库名称,基于access)

字段 loginname    文本类型

         pwd          文本类型