首頁>網絡編程教程>ASP教程

ASP+ajax註冊即時提示程式代碼

作者：Eve Cole 更新時間：2025-03-15 01:16:01

史上最強大的ASP+ajax註冊即時提示程序，一般用在檢測用戶註冊前的問題，需要的朋友可以參考下。 1.註冊時驗證資料庫使用者名稱是否存在。

2.輸入密碼時提示密碼強度及驗證2次密碼輸入是否一樣。

3.註冊時驗證資料庫聯絡信箱是否存在。

4.註冊時驗證使用者輸入的驗證碼及系統產生的驗證碼是否一致。

5.對輸入中文驗證

6、QQ號碼驗證

7.身分證號碼驗證

複製代碼代碼如下:

<!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>性別：</td>

<td><input type=radio name=u_sex value=男/>男<input type=radio name=u_sex value=女/>女<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位數>我身分證最後6位數</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>取回密碼和修改密碼時使用，請您正確填寫。格式:[email protected] </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( ); /></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>聯絡QQ：</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>為了方便聯繫，請正確填寫</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> </td>

<td align=center><input type=button onclick=tijiao() name=Submit value=確認註冊/></td>

<td> </td>

<td> </td>

</tr>

</table>

</form>

</body></html>

regin.js程式碼如下

//建立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)//數字

return 1;

if(iN>=65 && iN<=90)//大寫字母

return 2;

if(iN>=97 && iN<=122)//小寫

return 4;

else

return 8;//特殊字符

}

//計算出目前密碼當中一共有多少種模式

function bitTotal(num){

var modes=0;

for(i=0;i<4;i++){

if(num&1)

modes++;

num >>=1;

}

return modes;

}

//返回密碼的強度級別

function checkStrong(sPW){

if(sPW.length<6)

return 0;//密碼太短

var Modes=0;

for(i=0;i<sPW.length;i++){

//測試每一個字元的類別並統計共有多少種模式.

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(GE​​T, 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=names&name=+ escape(name);

name_xml();

name_re.open(GE​​T, 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>該使用者名稱已經存在！ </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.length<6){

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>請填入問題答案</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>請輸入正確的郵件地址，格式為：[email protected]</span>';

return false;

}

}

function email_ajax(u_mail){

var email=u_mail;

var url=ajax.asp?action=email&mail=+ escape(email);

name_xml();

name_re.open(GE​​T, 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.length<2){

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.length<5){

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(驗證通過!,身分證號碼位數不對!,出生日期超出範圍或含有非法字元!,身分證號碼校驗錯誤!,身分證地區非法!);

var area={11:北京,12:天津,13:河北,14:山西,15:內蒙古,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(郵箱已經存在，重新輸入一個);

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;

}

相關文章