Tc711Com提示：今天给大家 介绍  ASP+ajax完美实现用户表单检测和注册, 此代码经调试完整可用,遇到相关问题可以到论坛发贴: http://bbs.tc711.com/ .

先说ＪＳ代码
<script language="javascript" type="text/javascript">
<!--
var msg ;
var li_ok='images/li_ok.gif'; //用于显示正确的图标
var li_err='images/li_err.gif' //用于显示错误时的图标
var bname_m=false;
msg=new Array(
"请输入4-20位字符，英文、数字的组合。",
"请输入6位以上字符，不允许空格。",
"请重复输入上面的密码。",
"请输入您的真实姓名",
"请输入电话号码",
"请输入电子邮箱",
"请输入左边的验证码",
"您必须同意注册条款"
)
//定义一个消息数组，用于显示提示信息
var xmlHttp = false;
try {
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e2) {
xmlHttp = false;
}
}
if (!xmlHttp && typeof XMLHttpRequest != 'undefined') {
xmlHttp = new XMLHttpRequest();
}
//建立xmlhttp实现浏览器的兼容
function show(){
if (document.getElementById("country").value=="China"){
document.getElementById("probince").style.display=""
}else
{
document.getElementById("probince").style.display="none"
}
}
//显示隐藏的国家信息对应的地区信息
function GetCookie(sName)
{
// cookies are separated by semicolons
var aCookie = document.cookie.split("; ");
for (var i=0; i < aCookie.length; i++)
{
// a name/value pair (a crumb) is separated by an equal sign
var aCrumb = aCookie.split("=");
if (sName == aCrumb[0])
return unescape(aCrumb[1]);
}
// a cookie with the requested name does not exist
return null;
}
//用ＪＳ读取cookies
function on_input(objname){
var strtxt;
var obj=document.getElementById(objname);
//obj.className="d_on";
//alert(objname);
switch (objname){
case "d_username":
strtxt=msg[0];
break;
case "d_pass":
strtxt=msg[1];
break;
case "d_pass2":
strtxt=msg[2];
break;
case "d_truename":
strtxt=msg[3];
break;
case "d_phone":
strtxt=msg[4];
break;
case "d_email":
strtxt=msg[5];
break;
case "d_code":
strtxt=msg[6];
break;
}
obj.innerHTML=strtxt;
}
//做鼠标放文框时的提示信息
function callServer() {
var u_name = document.getElementById("user_name").value;
if ((u_name == null) || (u_name == "")||(u_name.length<4)||(u_name.length>20)) {
d_username.className="d_err";
d_username.innerHTML=msg[0];
chk=false
return chk;};
xmlHttp.open("POST", "user/checkuser.asp", true);
xmlHttp.setRequestHeader('Content-type','application/x-www-form-urlencoded');
xmlHttp.onreadystatechange = updatePage;
xmlHttp.send("username="+escape(u_name));
}
function updatePage() {
if (xmlHttp.readyState < 4) {
d_username.innerHTML="loading...";
}
if (xmlHttp.readyState == 4 && 200==xmlHttp.status) {
var response = xmlHttp.responseText;
if (response==1)
{
d_username.className="d_ok";
d_username.innerHTML='恭喜用户名可以使用。';
}
else{
d_username.className="d_err";
d_username.innerHTML="用户名已占用，请重新注册";
}
}
}
//检测用户名是否可用
function out_pass(){
var obj=document.getElementById("d_pass");
var str=document.getElementById("password").value;
var chk=true;
if (str=='' || str.length<6 || str.length>18){chk=false;}
if (chk){
obj.className="d_ok";
obj.innerHTML='密码已经输入。';
}else{
obj.className="d_err";
obj.innerHTML=msg[1];
}
return chk;
}
//检查密码是否输入
function out_pass2(){
var obj=document.getElementById("d_pass2");
var str=document.getElementById("password2").value;
var chk=true;
if (str=='' || str!=document.getElementById("password").value){chk=false;}
if (chk){
obj.className="d_ok";
obj.innerHTML='重复密码输入正确。';
}else{
obj.className="d_err";
obj.innerHTML=msg[2];
}
return chk;
}
//检查密码确认
function out_truename(){
var obj=document.getElementById("d_truename");
var str=document.getElementById("truename").value;
var chk=true;
if (str=='' || str.length<4){chk=false;}
if (chk){
obj.className="d_ok";
obj.innerHTML="姓名已输入";
}else{
obj.className="d_err";
obj.innerHTML=msg[3];
}
return chk;
}
//检查真实姓名
function out_phone(){
var obj=document.getElementById("d_phone");
var str=document.getElementById("phone3").value;
var chk=true;
if (str=='' || !str.match(/^\d{7,8}$/ig)){chk=false;}
if (chk){
document.getElementById("tr_phone").style.disply="";
obj.className="d_ok";
obj.innerHTML="电话号码已输入";
}else{
document.getElementById("tr_phone").style.disply="";
obj.className="d_err";
obj.innerHTML=msg[4];
}
return chk;
}
//检查真实姓名
function out_email(){
var obj=document.getElementById("d_email");
var str=document.getElementById("email").value;
var chk=true;
if (str==''|| !str.match(/^[\w\.\-]+@([\w\-]+\.)+[a-z]{2,4}$/ig)){chk=false}
if (chk){
obj.className="d_ok";
obj.innerHTML='电子邮箱地址已经输入。';
}else{
obj.className="d_err";
obj.innerHTML=msg[5];
}
return chk;
}
//检查email
function out_code(){
var obj=document.getElementById("d_code");
var str=document.getElementById("code").value;
var chk=true;
if (str==''|| str!=GetCookie("verifycode")){chk=false}
if (chk){
obj.className="d_ok";
obj.innerHTML='验证码已输入';
}else{
obj.className="d_err";
obj.innerHTML=msg[6];
}
return chk;
}
//检查验证码
function out_reg(){
var obj=document.getElementById("d_regtxt");
var chk=true;
if (!document.getElementById("regtxt").checked){chk=false}
if (chk){
obj.className="d_ok";
obj.innerHTML="您已同意注册条款";
}else{
obj.className="d_err";
obj.innerHTML=msg[7];
}
return chk;
}
//检查是否同意了注册条款
function chk_reg(){
var chk=true
if (document.getElementById("user_name").value==''){
chk=false;
d_username.className="d_err";
d_username.innerHTML=msg[0];
}
if (!out_reg()){chk=false}
if (!out_pass()){chk=false}
if (!out_pass2()){chk=false}
if (!out_truename()){chk=false}
if (!out_phone()){chk=false}
if (!out_email()){chk=false}
if(!out_code()){chk=false}
if(chk){
document.getElementById('save_stat').innerHTML='<img src="images/loading.gif" align="absmiddle" />数据提交中……请稍候……'
document.getElementById('regbutton').disabled='disabled';
var username=document.getElementById("user_name").value;
var password=document.getElementById("password").value;
var truename=document.getElementById("truename").value;
if(document.regform.sex[0].checked)
{
var sex=1;
}
else
{
var sex=0;
}
var phone=document.getElementById("phone1").value+document.getElementById("phone2").value+document.getElementById("phone3").value;
var fax=document.getElementById("fax1").value+document.getElementById("fax2").value+document.getElementById("fax3").value;
var email=document.getElementById("email").value;
var mobile=document.getElementById("mobile").value;
var address=document.getElementById("street").value+","+document.getElementById("city").value+","+document.getElementById("country").value;
var probince=document.getElementById("vprobince").value;
var zip=document.getElementById("zip").value;
xmlHttp.open("POST", "user/saveuser.asp", true);
xmlHttp.setRequestHeader('Content-type','application/x-www-form-urlencoded');
xmlHttp.onreadystatechange = saveuser;
xmlHttp.send("username="+escape(username)+"&password="+escape(password)+"&email="+escape(email)+"&truename="+escape(truename)+"&sex="+escape(sex)+"&phone="+escape(phone)+"&fax="+escape(fax)+"&mobile="+escape(mobile)+"&address="+escape(address)+"&probince="+escape(probince)+"&zip="+escape(zip));
}
}
function saveuser() {
if (xmlHttp.readyState < 4) {
d_username.innerHTML="loading...";
}
if (4==xmlHttp.readyState){
if (200==xmlHttp.status){
var date=xmlHttp.responseText;
if (date==1){
alert("用户注册成功!");
//window.location.href='\/exhibit';
window.location.href="/";
}else{
alert("注册发生错误!");
window.location.href="breg.asp";
}
}else{
alert("error");
}
}
}
//当点击注册按钮后所进行的检测，如果所有必填项都写了则发送注册信息到user/saveuser.asp进行用户的注册
-->
</script>

下面是页面布局的代码