ASP+ajax注冊即時提示程序代碼

!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" />
meta name="copyright" content="Copyright 2008-2009 bbmoo.com All Rights Reserved"/>
title>http://www.51weidi.com—會員注冊/title>
script language="javascript" src="regin.js" type="text/javascript">/script>
style type="text/css">
.tr,td{
line-height:25px;
font-size:14px;
color: #333;
}
.msg{ color:#FF3300}
.msg2{ color: #006600}
.reg_title{
text-indent:20px;
font-weight:bold;
}
.STYLE1 {color: #FF3300; font-weight:bold;}
/style>
body>
form action="reg.asp" method="post" name="form2">
table width="100%" border="0" cellspacing="1" cellpadding="1">
tr>
td colspan="4" class="reg_title">用戶注冊，必填信息/td>
/tr>
tr>
td width="14%" align="right">用戶名：/td>
td width="12%">input name="u_name" id="u_name" type="text" maxlength="10" onblur="isName()" />/td>
td width="2%">span class="STYLE1" id="name_re">*/span>/td>
td width="72%" id="name_re_m">4～10個字符，一個中文2個字符/td>
/tr>
tr>
td align="right">性nbsp;別：/td>
td>input type="radio" name="u_sex" value="男" />男nbsp;input type="radio" name="u_sex" value="女" />女nbsp;input type="radio" name="u_sex" value="人妖" />人妖/td>
td>span class="STYLE1" id="sex_re">*/span>/td>
td id="sex_re_m">自己看著選一個/td>
/tr>
tr>
td align="right">登陸密碼：/td>
td>input name="u_pass" id="u_pass" type="password" maxlength="12" onblur="password()" onkeyup="showStrongPic();"/>/td>
td>span class="STYLE1" id="pass_re">*/span>/td>
td>span id="lowPic" style="display:" >img src="images/gread_l_x.gif" />/span>
span id="midPic" style="display:none">img src="images/gread_m_x.gif" />/span>
span id="highPic" style="display:none">img src="images/gread_h_x.gif" />/span>/td>
/tr>
tr>
td align="right">確認密碼：/td>
td>input name="u_pass_re" id="u_pass_re" type="password" maxlength="12" onblur="pass_re()" />/td>
td>span class="STYLE1" id="pass_re_re">*/span>/td>
td id="pass_re_re_m">請您再輸入一次密碼/td>
/tr>
tr>
td align="right">安全問題：/td>
td>select name="u_ask">
option value="我的真實姓名">我的真實姓名/option>
option value="我身份證最后6位數(shù)">我身份證最后6位數(shù)/option>
option value="我高中班主任名字">我高中班主任名字/option>
option value="我最喜歡的顏色">我最喜歡的顏色/option>
option value="我家里的郵編號碼">我家里的郵編號碼/option>
/select> /td>
td>span class="STYLE1">*/span>/td>
td>選一個熟悉的問題/td>
/tr>
tr>
td align="right">安全答案：/td>
td>input name="u_answer" id="u_answer" type="text" maxlength="20" onblur="answer()" />/td>
td>span class="STYLE1" id="answer_re">*/span>/td>
td id="answer_re_m">上面問題的答案，找回密碼時用/td>
/tr>
tr>
td align="right">電子郵箱：/td>
td>input name="u_mail" id="u_mail" type="text" maxlength="20" onblur="isEmail()" />/td>
td>span class="STYLE1" id="mail_re">*/span>/td>
td id="mail_re_m">取回密碼和修改密碼時使用，請您正確填寫。格式:123567@qq.com /td>
/tr>
tr>
td align="right">驗證碼：/td>
td>input name="CheckCode" type=text id="CheckCode" size="4" maxlength="4" onblur="isCheckCode()">img src="Code.asp" onclick="this.src = this.src+'?'+Math.random();" alt="點擊刷新驗證碼" style="cursor:pointer"/>
/td>
td>span class="STYLE1" id="CheckCode_re">*/span>/td>
td id="CheckCode_re_m">請輸入正確的驗證碼/td>
/tr>
tr>
td colspan="4" class="reg_title">其他信息，可不填，建議你填完整/td>
/tr>
tr>
td align="right">真實姓名：/td>
td>input name="u_name_zs" id="u_name_zs" type="text" maxlength="4" onblur="name_zs()" />/td>
td>span class="STYLE1" id="name_zs_re">/span>/td>
td id="name_zs_re_m">兌換積分時用，請正確填寫/td>
/tr>
tr>
td align="right">p>聯(lián)系 Q Q：/p> /td>
td>input name="u_qq" id="u_qq" type="text" maxlength="11" onkeyup="value=value.replace(/[^\d]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))" onblur="qq()" />/td>
td>span class="STYLE1" id="qq_re">/span>/td>
td id="qq_re_m">為了方便聯(lián)系，請正確填寫/td>
/tr>
tr>
td align="right">支付寶號：/td>
td>input name="u_alipay" id="u_alipay" type="text" maxlength="20" onblur="alipay()" />/td>
td>span class="STYLE1" id="alipay_re">/span>/td>
td id="alipay_re_m">兌換積分時用，請正確填寫，并保證此號碼綁定的姓名和上面的一致/td>
/tr>
tr>
td align="right">身份證號碼：/td>
td>input name="u_nunber" id="u_nunber" type="text" maxlength="18" onkeyup="nunber()" />/td>
td>span class="STYLE1" id="nunber_re">/span>/td>
td id="nunber_re_m">特殊情況需要用到，建議填寫/td>
/tr>
tr>
td align="right">nbsp;/td>
td align="center">input type="button" onclick="tijiao()" name="Submit" value="確認注冊" />/td>
td>nbsp;/td>
td>nbsp;/td>
/tr>
/table>
/form>
/body>/html>
regin.js代碼如下
//創(chuàng)建ajax對象
var name_re = false;
function name_xml()
{
try {
name_re = new XMLHttpRequest();
} catch (trymicrosoft) {
try {
name_re = new ActiveXObject("Msxml2.XMLHTTP");
} catch (othermicrosoft) {
try {
name_re = new ActiveXObject("Microsoft.XMLHTTP");
} catch (failed) {
name_re = false;
}
}
}
if (!name_re)
alert("Error initializing XMLHttpRequest!");
}
var name_use;
var mail_use;
//ajax密碼強度驗證
function allNumber(v)
{
var reg = /^[0-9]*$/;
if(reg.test(v))
{
return true;
}
return false;
}
function CharMode(iN){
if(iN>=48 iN=57)//數(shù)字
return 1;
if(iN>=65 iN=90)//大寫字母
return 2;
if(iN>=97 iN=122)//小寫
return 4;
else
return 8;//特殊字符
}
//計算出當(dāng)前密碼當(dāng)中一共有多少種模式
function bitTotal(num){
var modes=0;
for(i=0;i4;i++){
if(num1)
modes++;
num >>=1;
}
return modes;
}
//返回密碼的強度級別
function checkStrong(sPW){
if(sPW.length6)
return 0;//密碼太短
var Modes=0;
for(i=0;isPW.length;i++){
//測試每一個字符的類別并統(tǒng)計一共有多少種模式.
Modes|=CharMode(sPW.charCodeAt(i));
}
// alert(bitTotal(Modes));
return bitTotal(Modes);
}
function showStrongPic()
{
var v = document.getElementById('u_pass').value;
var m = checkStrong(v);
if(m 2)
{
document.getElementById('lowPic').style.display="";
document.getElementById('midPic').style.display="none";
document.getElementById('highPic').style.display="none";
}
else if(m==2)
{
document.getElementById('lowPic').style.display="none";
document.getElementById('midPic').style.display="";
document.getElementById('highPic').style.display="none";
}
else
{
document.getElementById('lowPic').style.display="none";
document.getElementById('midPic').style.display="none";
document.getElementById('highPic').style.display="";
}
}
//ajax驗證碼驗證
function isCheckCode(){
var CheckCode = document.getElementById('CheckCode').value;
if (CheckCode==""){
document.getElementById('CheckCode_re').innerHTML='img src=check_error.gif>';
document.getElementById('CheckCode_re_m').innerHTML='span class=msg>驗證碼不能為空！/span>';
return false;
}else{
Code_ajax(CheckCode)
}
}
function Code_ajax(CheckCode){
var Code=CheckCode;
var url="code_ajax.asp?Code="+ escape(Code);
name_xml();
name_re.open("GET", url, true);
name_re.setRequestHeader("content-type","text/xml");
name_re.onreadystatechange = Code_requst;
name_re.setRequestHeader("If-Modified-Since","0");
name_re.send(null);
}
function Code_requst(){
if(name_re.readyState==4 name_re.status==200)//返回完成
{
var msg=name_re.responseText;
if (msg=="yes"){
document.getElementById('CheckCode_re').innerHTML='img src=check_error.gif>';
document.getElementById('CheckCode_re_m').innerHTML='span class=msg>驗證碼錯誤！/span>';
Code_msg(0);
return false;
}
else{
document.getElementById('CheckCode_re').innerHTML='img src=check_right.gif>';
document.getElementById('CheckCode_re_m').innerHTML='span class=msg2>輸入正確！/span>';
Code_msg(1);
return true;
}
}
}
function Code_msg(n){
var n=n;
if(n==0){
Code_use=true;
}
else{
Code_use=false;
}
}
//ajax用戶名驗證
function isName(){
var u_name = document.getElementById('u_name').value;
if (u_name==""){
document.getElementById('name_re').innerHTML='img src=check_error.gif>';
document.getElementById('name_re_m').innerHTML='span class=msg>用戶名不能為空，4-10個字符/span>';
return false;
}else{
user_ajax(u_name)
}
}
function user_ajax(u_name){
var name=u_name;
var url="ajax.asp?action=namesname="+ escape(name);
name_xml();
name_re.open("GET", url, true);
name_re.setRequestHeader("content-type","text/xml");
name_re.onreadystatechange = name_requst;
name_re.setRequestHeader("If-Modified-Since","0");
name_re.send(null);
}
function name_requst(){
if(name_re.readyState==4 name_re.status==200)//返回完成
{
var msg=name_re.responseText;
if (msg=="yes"){
document.getElementById('name_re').innerHTML='img src=check_error.gif>';
document.getElementById('name_re_m').innerHTML='span class=msg>該用戶名已經(jīng)存在！/span>';
name_msg(0);
return false;
}
else{
document.getElementById('name_re').innerHTML='img src=check_right.gif>';
document.getElementById('name_re_m').innerHTML='span class=msg2>可以注冊！/span>';
name_msg(1);
return true;
}
}
}
function name_msg(n){
var n=n;
if(n==0){
name_use=true;
}
else{
name_use=false;
}
}
//性別是否選擇檢測
function sex(){
if(document.form2.u_sex[0].checked==false document.form2.u_sex[1].checked==false document.form2.u_sex[2].checked==false) {
document.getElementById('sex_re').innerHTML='img src=check_error.gif>';
document.getElementById('sex_re_m').innerHTML='span class=msg>沒有選擇性別/span>';
return false;
}
else{
document.getElementById('sex_re').innerHTML='img src=check_right.gif>';
document.getElementById('sex_re_m').innerHTML='span class=msg2>已選擇/span>';
return true;
}
}
//密碼是否為空檢測
function password(){
var u_pass = document.getElementById('u_pass').value;
if(u_pass=="" || u_pass.length6){
document.getElementById('pass_re').innerHTML='img src=check_error.gif>';
return false;
}
else{
document.getElementById('pass_re').innerHTML='img src=check_right.gif>';
return true;
}
}
//確認密碼檢測
function pass_re(){
var u_pass=document.getElementById('u_pass').value;
var pass_re=document.getElementById('u_pass_re').value;
if(u_pass != pass_re){
document.getElementById('pass_re_re').innerHTML='img src=check_error.gif>';
document.getElementById('pass_re_re_m').innerHTML='span class=msg>兩次密碼不一致，請重新輸入/span>';
return false;
}
else{
document.getElementById('pass_re_re').innerHTML='img src=check_right.gif>';
document.getElementById('pass_re_re_m').innerHTML='span class=msg2>填寫正確/span>';
return true;
}
}
//密碼保護問題檢測
function answer(){
var u_answer=document.getElementById('u_answer').value;
if(u_answer==""){
document.getElementById('answer_re').innerHTML='img src=check_error.gif>';
document.getElementById('answer_re_m').innerHTML='span class=msg>請?zhí)顚憜栴}答案/span>';
return false;
}
else{
document.getElementById('answer_re').innerHTML='img src=check_right.gif>';
document.getElementById('answer_re_m').innerHTML='span class=msg2>填寫正確/span>';
return true;
}
}
//郵箱格式驗證
function isEmail() {
var u_mail=document.getElementById('u_mail').value;
if (u_mail.search(/^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/) != -1){
email_ajax(u_mail);
}
else{
document.getElementById('mail_re').innerHTML='img src=check_error.gif>';
document.getElementById('mail_re_m').innerHTML='span class=msg>請輸入正確的郵箱地址，格式為：123456@qq.com/span>';
return false;
}
}
function email_ajax(u_mail){
var email=u_mail;
var url="ajax.asp?action=emailmail="+ escape(email);
name_xml();
name_re.open("GET", url, true);
name_re.setRequestHeader("content-type","text/xml");
name_re.onreadystatechange = mail_requst;
name_re.setRequestHeader("If-Modified-Since","0");
name_re.send(null);
}
function mail_requst(){
if(name_re.readyState==4 name_re.status==200)//返回完成
{
var msg=name_re.responseText;
if (msg=="yes"){
document.getElementById('mail_re').innerHTML='img src=check_error.gif>';
document.getElementById('mail_re_m').innerHTML='span class=msg>該郵箱已被使用，請換一個/span>';
mail_msg(0);
return false;
}
else{
document.getElementById('mail_re').innerHTML='img src=check_right.gif>';
document.getElementById('mail_re_m').innerHTML='span class=msg2>可以使用/span>';
mail_msg(1);
return true;
}
}
}
function mail_msg(n){
var n=n;
if(n==0){
mail_use=true;
}
else{
mail_use=false;
}
}
//真實姓名檢測
function name_zs(){
var name_zs=document.getElementById('u_name_zs').value;
if (name_zs != name_zs.replace(/[^\u4E00-\u9FA5]/g,'')|| name_zs=="" || name_zs.length2){
document.getElementById('name_zs_re').innerHTML='img src=check_error.gif>';
document.getElementById('name_zs_re_m').innerHTML='span class="msg">請輸入真實的中文名字/span>';
return false;
}
else{
document.getElementById('name_zs_re').innerHTML='img src=check_right.gif>';
document.getElementById('name_zs_re_m').innerHTML='span class="msg2">填寫正確/span>';
return true;
}
}
//QQ號碼檢測
function qq(){
var qq=document.getElementById('u_qq').value;
if(qq=="" || qq.length5){
document.getElementById('qq_re').innerHTML='img src=check_error.gif>';
document.getElementById('qq_re_m').innerHTML='span class="msg">正確的QQ是5-10位哦/span>';
return false;
}
else{
document.getElementById('qq_re').innerHTML='img src=check_right.gif>';
document.getElementById('qq_re_m').innerHTML='span class="msg2">填寫正確/span>';
return true;
}
}
//檢測支付寶帳號
function alipay(){
var alipay=document.getElementById('u_alipay').value;
if (alipay.search(/^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/) != -1){
document.getElementById('alipay_re').innerHTML='img src=check_right.gif>';
document.getElementById('alipay_re_m').innerHTML='span class=msg2>填寫正確/span>';
return true;
}
else{
document.getElementById('alipay_re').innerHTML='img src=check_error.gif>';
document.getElementById('alipay_re_m').innerHTML='span class=msg>錯誤的支付寶帳號/span>';
return false;
}
}
//身份證號碼檢測
function nunber(){
var idcard=document.getElementById('u_nunber').value;
var Errors=new Array("驗證通過!","身份證號碼位數(shù)不對!","出生日期超出范圍或含有非法字符!","身份證號碼校驗錯誤!","身份證地區(qū)非法!");
var area={11:"北京",12:"天津",13:"河北",14:"山西",15:"內(nèi)蒙古",21:"遼寧",22:"吉林",23:"黑龍江",31:"上海",32:"江蘇",33:"浙江",34:"安徽",35:"福建",36:"江西",37:"山東",41:"河南",42:"湖北",43:"湖南",44:"廣東",45:"廣西",46:"海南",50:"重慶",51:"四川",52:"貴州",53:"云南",54:"西藏",61:"陜西",62:"甘肅",63:"青海",64:"寧夏",65:"新疆",71:"臺灣",81:"香港",82:"澳門",91:"國外"}
var idcard,Y,JYM;
var S,M;
var idcard_array = new Array();
idcard_array = idcard.split("");
if(area[parseInt(idcard.substr(0,2))]==null)
{
document.getElementById('nunber_re').innerHTML='img src=check_error.gif>';
document.getElementById('nunber_re_m').innerHTML="span class=msg>"+Errors[4]+"/span>";
return false;
}
switch(idcard.length){
case 15:
if ( (parseInt(idcard.substr(6,2))+1900) % 4 == 0 || ((parseInt(idcard.substr(6,2))+1900) % 100 == 0 (parseInt(idcard.substr(6,2))+1900) % 4 == 0 )){
ereg=/^[1-9][0-9]{5}[0-9]{2}((01|03|05|07|08|10|12)(0[1-9]|[1-2][0-9]|3[0-1])|(04|06|09|11)(0[1-9]|[1-2][0-9]|30)|02(0[1-9]|[1-2][0-9]))[0-9]{3}$/;
} else {
ereg=/^[1-9][0-9]{5}[0-9]{2}((01|03|05|07|08|10|12)(0[1-9]|[1-2][0-9]|3[0-1])|(04|06|09|11)(0[1-9]|[1-2][0-9]|30)|02(0[1-9]|1[0-9]|2[0-8]))[0-9]{3}$/;
}
if(ereg.test(idcard)){
document.getElementById('nunber_re').innerHTML='img src=check_right.gif>';
document.getElementById('nunber_re_m').innerHTML="span class=msg2>"+Errors[0]+"/span>";
return true;
}
else {
document.getElementById('nunber_re').innerHTML='img src=check_error.gif>';
document.getElementById('nunber_re_m').innerHTML="span class=msg>"+Errors[2]+"/span>";
return false;
}
break;
case 18:
//18位身份號碼檢測
if ( parseInt(idcard.substr(6,4)) % 4 == 0 || (parseInt(idcard.substr(6,4)) % 100 == 0 parseInt(idcard.substr(6,4))%4 == 0 )){
ereg=/^[1-9][0-9]{5}19[0-9]{2}((01|03|05|07|08|10|12)(0[1-9]|[1-2][0-9]|3[0-1])|(04|06|09|11)(0[1-9]|[1-2][0-9]|30)|02(0[1-9]|[1-2][0-9]))[0-9]{3}[0-9Xx]$/;
} else {
ereg=/^[1-9][0-9]{5}19[0-9]{2}((01|03|05|07|08|10|12)(0[1-9]|[1-2][0-9]|3[0-1])|(04|06|09|11)(0[1-9]|[1-2][0-9]|30)|02(0[1-9]|1[0-9]|2[0-8]))[0-9]{3}[0-9Xx]$/;
}
if(ereg.test(idcard)){
S = (parseInt(idcard_array[0]) + parseInt(idcard_array[10])) * 7
+ (parseInt(idcard_array[1]) + parseInt(idcard_array[11])) * 9
+ (parseInt(idcard_array[2]) + parseInt(idcard_array[12])) * 10
+ (parseInt(idcard_array[3]) + parseInt(idcard_array[13])) * 5
+ (parseInt(idcard_array[4]) + parseInt(idcard_array[14])) * 8
+ (parseInt(idcard_array[5]) + parseInt(idcard_array[15])) * 4
+ (parseInt(idcard_array[6]) + parseInt(idcard_array[16])) * 2
+ parseInt(idcard_array[7]) * 1
+ parseInt(idcard_array[8]) * 6
+ parseInt(idcard_array[9]) * 3 ;
Y = S % 11;
M = "F";
JYM = "10X98765432";
M = JYM.substr(Y,1);
if(M == idcard_array[17]){
document.getElementById('nunber_re').innerHTML='img src=check_right.gif>';
document.getElementById('nunber_re_m').innerHTML="span class=msg2>"+Errors[0]+"/span>";
return true;
}
else {
document.getElementById('nunber_re').innerHTML='img src=check_error.gif>';
document.getElementById('nunber_re_m').innerHTML="span class=msg>"+Errors[3]+"/span>";
return false;
}
}
else {
document.getElementById('nunber_re').innerHTML='img src=check_error.gif>';
document.getElementById('nunber_re_m').innerHTML="span class=msg>"+Errors[2]+"/span>";
return false;
}
break;
default:
document.getElementById('nunber_re').innerHTML='img src=check_error.gif>';
document.getElementById('nunber_re_m').innerHTML="span class=msg>"+Errors[1]+"/span>";
return false;
}
}
//全表單提交驗證
function tijiao(){
if (isName()==false){
alert("名字不能為空");
return false;
}
if (name_use==true){
alert("名字已存在，重新輸入");
return false;
}
if (sex()==false){
alert("請選擇你的性別");
return false;
}
if (password()==false){
alert("密碼必須填寫");
return false;
}
if (pass_re()==false){
alert("確認密碼錯誤");
return false;
}
if (answer()==false){
alert("安全問題答案必須填寫");
return false;
}
if (isEmail()==false){
alert("郵箱地址為空或者錯誤");
return false;
}
if (mail_use==true){
alert("郵箱已經(jīng)存在，重新輸入一個");
return false;
}
if(document.getElementById('u_name_zs').value !=""){
if(name_zs()==false){
alert("真實姓名填寫錯誤");
return false;
}
}
if(document.getElementById('u_qq').value !=""){
if(qq()==false){
alert("qq號碼填寫錯誤");
return false;
}
}
if (document.getElementById('u_alipay').value !=""){
if(alipay()==false){
alert("支付寶帳號填寫錯誤");
return false;
}
}
if (document.getElementById('u_nunber').value !=""){
if(nunber()==false){
alert("身份證號碼填寫錯誤");
return false;
}
}
document.form2.submit();
return true;
}