《ASP Ajax用户注册实例.docx》由会员分享，可在线阅读，更多相关《ASP Ajax用户注册实例.docx（11页珍藏版）》请在三一办公上搜索。
1、ASP Ajax 用户注册实例ASP Ajax 用户注册实例 在制作网站的过程中，经常遇到用户注册的验证问题。本实例通过制作基于Ajax的用户注册，演示了如何实现动态验证的效果。步骤如下所示： 首先为本实例设计数据库，新建一个名为username.mdb的Access数据库文件，该数据库只有一个用户表，表设计视图如表8-1所示，设计完成后把表名设置为puser保存。 表8-1 设计puser表的字段 字段名 y_id y_username y_password 字段类型 自动编号 文本(50) 文本(50) 字段说明 主键，自增列 用户名 密码 新建一个名为adoconn.asp的asp文件，
2、该文件用来连接数据库，内容如下所示： 新建一个名为index.html的HTML文件，该文件为前台显示页面，内容为一个FORM表单，供用户输入相关信息，代码如下所示： 填写你的注册信息 用户名： 密码： 重复密码： 添加检验用户名的JavaScript代码函数checkUserName。该函数创建XMLHttpRequest对象，向服务器端发送请求，根据服务器端返回的数据显示相关信息。效果如图8-4所示，代码如下所示： !- function checkUserName username=document.getElementById(username
3、).value; var xmlhttp; try catch (e) try xmlhttp=new ActiveXObject(Microsoft.XMLHTTP); catch (e) if (username=) msg=用户名不能为空; /创建请求，并使用escape对username编码，以避免乱码 xmlhttp.open(get,checkuser.asp?username=+escape(username)+ &t= + new Date.getTime); xmlhttp.onreadystatechange=function if(4=xmlhttp.readyState
4、) var ch=document.getElementById(check1); ch.innerHTML=+msg+; return false; try xmlhttp=new XMLHttpRequest; catch (e) xmlhttp=new ActiveXObject(Msxml2.XMLHTTP); if(200=xmlhttp.status) if (xmlhttp.responseText=yes) else msg=网络链接失败; var ch=document.getElementById(check1); ch.innerHTML=+msg+; msg=此用户名已
5、经存在; else msg=输入正确; xmlhttp.send(null); return false; /- 图8-4 用户名为admin时的效果 添加检验密码的JavaScript代码函数checkpass。该函数验证密码的长度是否在620个字符之间。代码如下所示： function checkpass var Inform=form1; var Inputname=password; var Form=Inform+. eval(Temp=+Form+Inputname+.value;); /alert(Temp); if(Temp=) msg=此项不能为空; else msg=密码必
6、须在620个字符之间; else msg=输入正确; var ch=document.getElementById(password2); ch.innerHTML=+msg+; if(Temp.length20) 添加检验重复密码的JavaScript代码函数checkpass1。该函数除了验证重复密码的长度外，还验证是否与密码文本框中的值一样。代码如下所示： function checkpass1 var Inform=form1; var Inputname=password1; var Form=Inform+. eval(Temp=+Form+Inputname+.value;);
7、/alert(Temp); if(Temp=) msg=此项不能为空; else if(Temp.length20) msg=密码必须在620个字符之间; else var ch=document.getElementById(password3); ch.innerHTML=+msg+; var Inputname1=password; if (Temp!=Temp1) eval(Form+Inputname1+.value=;); eval(Form+Inputname1+.focus;); msg=两次密码不一样！; msg1=; var ch1=document.getElementB
8、yId(password2); ch1.innerHTML=+msg1+; else msg=输入正确; eval(Temp1=+Form+Inputname1+.value); eval(Form+Inputname+.value=;); 添加用户提交注册表单时的验证函数sendreg。该函数对注册表单内的各项进行验证，当全部通过后，创建XMLHttpRecordset对象，向服务器端发送注册请求。代码如下所示： function sendreg if(this.form1.username.value=) alert(请输入要注册的用户名); this.form1.username.foc
9、us; return false; if(this.form1.password.value=) alert(请输入密码); this.form1.password.focus; return false; else if(this.form1.password.value.length20) if(this.form1.password1.value=) alert(请输入密码); this.form1.password1.focus; return false; else if(this.form1.password1.value.length20) if(this.form1.passw
10、ord.value!=this.form1.password1.value) this.form1.password.value=; this.form1.password1.value=; this.form1.password.focus; alert(两次密码不一样，请重新输入); return false; alert(密码长度必须在620个字符); this.form1.password1.focus; return false; alert(密码长度必须在620个字符); this.form1.password.focus; return false; username=this.
11、form1.username.value; password=this.form1.password.value; var xmlhttp; try catch (e) try xmlhttp=new ActiveXObject(Microsoft.XMLHTTP); catch (e) /创建请求，并使用escape对username编码，以避免乱码 xmlhttp.onreadystatechange=function if(4=xmlhttp.readyState) if(200=xmlhttp.status) if (xmlhttp.responseText=yes) this.for
12、m1.username.value=; this.form1.password.value=; this.form1.password1.value=; document.getElementById(check1).innerHTML=; try xmlhttp=new XMLHttpRecordset; catch (e) xmlhttp=new ActiveXObject(Msxml2.XMLHTTP); else document.getElementById(password2).innerHTML=; document.getElementById(password3).inner
13、HTML=; alert(注册成功); this.form1.password.value=; this.form1.password1.value=; alert(注册失败); else alert(网络连接失败); /打开连接 xmlhttp.open(post,reg.asp,true) xmlhttp.setRequestHeader(Content-type,application/x-www-form-urlencoded); /发送数据 xmlhttp.send(username=+escape(username)+&password=+escape(password); 添加验证用户名的服务器端文件checkuser.asp，该文件根据用户提交的用户名，与数据库中的用户名字段进行比较，返回比较结果，代码如下所示： 添加接收用户注册信息的服务器端文件reg.asp。该文件根据用户提交的用户名，与数据库中的用户名字段进行比较，如果存在重复的用户名，返回“no”字符串。当注册信息都符合要求时，将用户的注册信息添加到用户表中，代码如下所示： 保存全部文件，在浏览器中运行index.html，输入注册信息，提交。效果如图8-5和图8-6所示： 图8-5 用户注册失败时效果 图8-6 用户注册成功时效果
