注册页面jQuery的Ajax请求,手写注册页面，并实现验证信息（AJAX,Jquery,正则表达式，密码强度验证）...-CSDN博客

Layout = null;

}

$(function () {

//验证用户名

$("#StudentLoginName").blur(function () {

yzLoginName();

})

//验证年龄

$("#StudentAge").blur(function () {

yzAge();

});

//验证本人姓名

$("#StudentName").blur(function () {

yzName();

})

//验证密码

//$("#StudentPwd").blur(function () {

// var v = $("#StudentPwd").val();

// //判断是否为非空字符，并且长度为6-16位的正则

// var gz = /S{6,16}/;

// //var gz = /^[A-Za-z0-9._-]{3,16}$/;

// if (gz.test(v)) {

// $("#pwd_msg").html("ok").css("color","green");

// }

// else {

// $("#pwd_msg").html("必须为6-16位的非空字符").css("color", "red");

// return false;

// }

//})

//验证两次密码一致

$("#PwdAgain").blur(function () {

yzPwdAgain();

})

//验证邮箱

$("#StudentEmail").blur(function () {

yzEmail();

})

//验证地址不为空

$("#StudentAddress").blur(function () {

yzAddress();

});

$("#im").click(function () {

$(this).attr("src", "/Handler/ValidateCode.ashx?_="+Math.random());

});

$("#sub").click(function () {

var tt = $("#viewData").val();

alert(tt);

if (tt == "false") {

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;

}

//bitTotal函数

//计算密码模式

function bitTotal(num) {

modes = 0;

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

if (num & 1) modes++;

num >>>= 1;

}

return modes;

}

//返回强度级别

function checkStrong(sPW) {

//if (sPW.length < 6 || sPW.length > 16)

$("#pwd_msg").html("必须为6到16位的非空字符").css("color", "red");

//$("#viewData").val("false");

//return 0; //密码太短

Modes = 0;

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

//密码模式

Modes |= CharMode(sPW.charCodeAt(i));

}

return bitTotal(Modes);

}

//显示颜色

function pwStrength(pwd) {

O_color = "#eeeeee";

L_color = "#FF0000";

M_color = "#FF9900";

H_color = "#33CC00";

if (pwd == null || pwd == ''||pwd.length < 6 || pwd.length > 16) {

Lcolor = Mcolor = Hcolor = O_color;

$("#pwd_msg").html("必须为6到16位的非空字符").css("color", "red");

$("#viewData").val("false");

}

else {

$("#tb").css("display", "inline");

$("#pwd_msg").html("");

S_level = checkStrong(pwd);

switch (S_level) {

case 0:

Lcolor = Mcolor = Hcolor = O_color;

case 1:

Lcolor = L_color;

Mcolor = Hcolor = O_color;

break;

case 2:

Lcolor = Mcolor = M_color;

Hcolor = O_color;

break;

default:

Lcolor = Mcolor = Hcolor = H_color;

}

$("#viewData").val("true");

}

document.getElementById("strength_L").style.background = Lcolor;

document.getElementById("strength_M").style.background = Mcolor;

document.getElementById("strength_H").style.background = Hcolor;

return;

}

//验证用户名的方法

function yzLoginName() {

//获取用户输入的字符串

var v = $("#StudentLoginName").val();

//验证符合3-16位符合要求的字符正则表达式

var gz = /^[A-Za-z0-9._-]{3,16}$/;

//验证首字符必须为字母的正则表达式

var sz = /^[A-Za-z]{1}/;

if (gz.test(v)) {

var sp = v.substr(0, 1);

if (sz.test(sp)) {

$.post("/User/CheckLoginName", {data:v}, function (msg) {

if (msg == "yes")

{

$("#username_msg").html("该用户名已使用").css("color", "red");

$("#viewData").val("false");

}

else if (msg == "no") {

$("#username_msg").html("恭喜，该用户名可以注册").css("color", "green");

$("#viewData").val("true");

}

else {

alert("服务器内部错误");

}

});

}

else {

$("#username_msg").html("首字符必须以字母开头").css("color", "red");

$("#viewData").val("false");

}

else {

$("#username_msg").html("长度应为3到16个字符").css("color", "red");

$("#viewData").val("false");

}

//验证年龄的方法

function yzAge() {

//获取用户输入的字符串

var age = $("#StudentAge").val();

//验证输入的为数字

var gz = /^[0-9]{1,}$/;

if (gz.test(age)) {

var ageInt = parseInt(age);

if (ageInt > 0 && ageInt < 150) {

$("#age_msg").html("ok").css("color", "green");

$("#viewData").val("true");

}

else {

$("#age_msg").html("年龄有误").css("color", "red");

$("#viewData").val("false");

}

else {

$("#age_msg").html("请输入数字").css("color", "red");

$("#viewData").val("false");

}

//验证本人姓名的方法

function yzName() {

var v = $("#StudentName").val();

if (v.length > 0) {

$("#name_msg").html("ok").css("color", "green");

$("#viewData").val("true");

}

else {

$("#name_msg").html("姓名不能为空").css("color", "red");

$("#viewData").val("false");

}

//验证两次密码一致的方法

function yzPwdAgain() {

var v = $("#PwdAgain").val();

var t = $("#StudentPwd").val();

if (v == t) {

$("#pwdagain_msg").html("ok").css("color", "green");

$("#viewData").val("true");

}

else {

$("#pwdagain_msg").html("密码不一致").css("color", "red");

$("#viewData").val("false");

}

//验证邮箱的方法

function yzEmail() {

var t = $("#StudentEmail").val();

//合法邮箱的正则表达式

var gz = /^[0-9a-zA-Z._-]+@@[0-9a-zA-Z]+([.][a-zA-Z]+){1,2}$/;

if (gz.test(t)) {

$("#email_msg").html("ok").css("color", "green");

$("#viewData").val("true");

}

else {

$("#email_msg").html("邮箱不合法").css("color", "red");

$("#viewData").val("false");

}

//验证地址栏的方法

function yzAddress() {

var address = $("#StudentAddress").val();

if (address.length > 0) {

$("#address_msg").html("ok").css("color", "green");

$("#viewData").val("true");

}

else {

$("#address_msg").html("地址不能为空").css("color", "red");

$("#viewData").val("false");

}

注册新帐户

用户名

3-16个字符，可使用字母，数字，下划线，需以字母开头

年龄：

年龄不能为空

真实姓名：

本人姓名填写不能为空

密码：

6~16个非空字符

弱

中

强

确认密码：

必须密码一致

Email：

规范的邮箱

地址：

地址不能为空

验证码：

ValidateCode.ashx

不区分大小写