|
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<script src="~/Scripts/jquery-1.7.1.js"></script>
<script src="~/Scripts/jquery.validate.js"></script>
<script>
$(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");
}
}
</script>
<title>Register</title>
</head>
<body>
<form method="post" action="/User/Register">
<div style="font-size: small">
<input type="hidden" id="viewData" value="true" />
<table width="80%" height="22" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td>
<div align="center">
<table height="61" cellpadding="0" cellspacing="0" style="height: 332px">
<tr>
<td height="33" colspan="6">
<p class="STYLE2" style="text-align: center">注册新帐户</p>
</td>
</tr>
<tr>
<td width="24%" align="center" valign="top" style="height: 26px">用户名</td>
<td valign="top" width="37%" align="left" style="height: 26px">
<input type="text" name="StudentLoginName" id="StudentLoginName" />
</td>
<td>
<span id="username_msg">3-16个字符，可使用字母，数字，下划线，需以字母开头</span>
</td>
</tr>
<tr>
<td width="24%" height="26" align="center" valign="top">年龄：</td>
<td valign="top" width="37%" align="left">
<input type="text" name="StudentAge" id="StudentAge" />
</td>
<td>
<span id="age_msg">年龄不能为空</span>
</td>
</tr>
<tr>
<td width="24%" height="26" align="center" valign="top">真实姓名：</td>
<td valign="top" width="37%" align="left">
<input type="text" name="StudentName" id="StudentName" />
</td>
<td>
<span id="name_msg">本人姓名填写不能为空</span>
</td>
</tr>
<tr>
<td width="24%" height="26" align="center" valign="top">密码：</td>
<td valign="top" width="37%" align="left">
<input type="password" name="StudentPwd" id="StudentPwd" onkeyup="pwStrength(this.value)" onblur="pwStrength(this.value)" />
</td>
<td>
<span id="pwd_msg">6~16个非空字符</span>
<table id="tb" width="210" border="1" cellspacing="0" cellpadding="1" bordercolor="#eeeeee" height="22" style='display:none'>
<tr align="center" bgcolor="#f5f5f5">
<td width="33%" id="strength_L">弱</td>
<td width="33%" id="strength_M">中</td>
<td width="33%" id="strength_H">强</td>
</tr>
</table>
</td>
</tr>
<tr>
<td width="24%" height="26" align="center" valign="top">确认密码：</td>
<td valign="top" width="37%" align="left">
<input type="password" name="PwdAgain" id="PwdAgain" />
</td>
<td>
<span id="pwdagain_msg">必须密码一致</span>
</td>
</tr>
<tr>
<td width="24%" height="26" align="center" valign="top">Email：</td>
<td valign="top" width="37%" align="left">
<input type="text" name="StudentEmail" id="StudentEmail" />
</td>
<td>
<span id="email_msg">规范的邮箱</span>
</td>
</tr>
<tr>
<td width="24%" height="26" align="center" valign="top">地址：</td>
<td valign="top" width="37%" align="left">
<input type="text" name="StudentAddress" id="StudentAddress" />
</td>
<td>
<span id="address_msg">地址不能为空</span>
</td>
</tr>
@* <tr>
<td width="24%" height="26" align="center" valign="top">验证码：</td>
<td valign="top" width="37%" align="left">
<input type="text" name="StudentAddress" id="StudentAddress" />
<img id="im" style="cursor: pointer" title="看不起？点我换一张" src="/Handler/ValidateCode.ashx" />
</td>
<td>
<span id="code_msg">不区分大小写</span>
</td>
</tr>*@
<tr>
<td colspan="3" align="center">
<input type="submit" value="注册" id="sub" />
</td>
</tr>
<tr>
<td colspan="3" align="center"> </td>
</tr>
</table>
</div>
</td>
</tr>
</table>
</div>
</form>
</body> </html> （编辑：李大同）
【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!
|
