自写验证类，用了Jquery1.4.2
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Reg.aspx.cs" Inherits="YXShop.Web.Reg" %>
<%@ Register Src="UserControls/NavControl.ascx" TagName="NavControl" TagPrefix="ucNav" %>
<%@ Register Src="UserControls/LeftSeriesControl.ascx" TagName="LeftSeriesControl"
TagPrefix="ucLeft" %>
<!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>
<title>康璐妮COLOR NIGHT</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="康璐妮,colornight" />
<meta name="description" content="康璐妮" />
<link href="css/master.css" type="text/css" rel="stylesheet" />
<link href="css/login.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
var IsReged = false;
var Valid = {
//设置提示
SetTip: function(fun, tip) {
if (typeof (fun) == "function") {
var ele = fun();
} else {
var ele = fun;
}
ele.css({ color: "red", fontWeight: "bold" })
ele.html(tip);
},
//取消默认动作，例如表单提交
CancelDefault: function(ffEvent) {
if (window.event) {
event.returnValue = false;
} else {
if (ffEvent) {
ffEvent.preventDefault();
}
}
},
//判断某个元素的value值是否为空串
IsEmptyStr: function(id) {
return "" == $.trim(this.$(id).val());
},
$: function(id) {
return $("#" + id)
},
//验证字符串是不是合法的Email地址
IsEmail: function(str) {
return this.RegEmail.test(str);
},
RegEmail: /^\w+(-\w+)*@\w+(-\w+)*\.\w{2,4}$/
}
//扩展函数，找到提示元素，一般是根据元素之间的层级关系来寻找，根据不同的页面实现不同
Valid.FindTip = function(id) {
return this.$(id).parent().next();
}
//扩展函数，验证,根据不同的页面实现不同，检查某个文本框的值是不是为空串
Valid.CheckTxt = function(id, ffEvent, tip) {
if (Valid.IsEmptyStr(id)) {
this.$(id).focus();
this.SetTip(this.FindTip(id), tip);
this.CancelDefault(ffEvent);
//已经验证一个不合格，就不执行此次验证后面的代码
throw Error("终止验证");
} else {
this.SetTip(this.FindTip(id), "");
}
}
function Check(ffEvent) {
try {
Valid.CheckTxt("txtUName", ffEvent, "用户名不能为空");
Valid.CheckTxt("txtPwd", ffEvent, "密码不能为空");
Valid.CheckTxt("txtEmail", ffEvent, "Email不能为空");
Valid.CheckTxt("txtQuestion", ffEvent, "提示问题不能为空");
Valid.CheckTxt("txtAnswer", ffEvent, "提示答案不能为空");
if (!Valid.IsEmail(Valid.$("txtEmail").val())) {
Valid.SetTip(Valid.FindTip("txtEmail"), "邮箱格式不合法");
Valid.$("txtEmail").focus();
Valid.CancelDefault(ffEvent);
} else if (Valid.$("txtPwd").val().length < 6) {
Valid.SetTip(Valid.FindTip("txtPwd"), "密码长度不能短于6位");
Valid.$("txtPwd").focus();
Valid.CancelDefault(ffEvent);
}
else if (Valid.$("txtPwd").val() != Valid.$("txtPwdAgain").val()) {
Valid.SetTip(Valid.FindTip("txtPwdAgain"), "两次密码输入不一致");
Valid.$("txtPwdAgain").focus();
Valid.CancelDefault(ffEvent);
} else if (IsReged) {
Valid.SetTip(Valid.FindTip("txtUName"), "用户名已经被注册，请更换用户名");
Valid.$("txtUName").focus();
Valid.CancelDefault(ffEvent);
}
} catch (ex) {
}
}
//检测用户名是否已经存在
function CheckUser() {
if (Valid.IsEmptyStr("txtUName")) {
Valid.$("txtUName").focus();
Valid.SetTip(function() { return Valid.$("txtUName").parent().next(); }, "用户名不能为空");
} else {
$.ajax({ data: { uname: Valid.$("txtUName").val() }, type: "post", dataType: "text", url: "Reg.ashx", success: function(data) {
if (data == "1") {
Valid.SetTip(Valid.FindTip("txtUName"), "用户名可以被注册");
IsReged = false;
} else {
Valid.SetTip(Valid.FindTip("txtUName"), "用户名已经被注册，请更换用户名");
Valid.$("txtUName").focus();
IsReged = true;
}
}
})
}
}
</script>
<style type="text/css">
.ltd
{
width: 100px;
padding-left: 0;
}
.mtd
{
width: 170px;
}
.rtd
{
width: 230px;
}
.reg
{
margin: 0 auto;
width: 50%; /*
border: 1px solid red;*/
}
td
{
}
.tb_reg
{
width: 500px;
}
</style>
</head>
<body>
<form runat="server" onsubmit="Check(event);">
<div id="header">
<div class="logo" title="康璐妮COLOR NIGHT">
<a href="index.html">
<img src="images/logo.gif" width="222" height="96" /></a></div>
<div class="top_ctr">
<a href="goods_list.html" class="link_01">购物车</a><a href="member/member_manage.html"
class="link_02">我的帐户</a><a href="#" class="link_03">热门推荐</a><a href="#" class="link_04">特价优惠</a><a
href="#" class="link_05">新品上架</a><a href="#" class="link_06">积分促销</a>
</div>
<ucNav:NavControl ID="ucNavTop" runat="server" HoverIndex="-1" />
<div class="search_bar">
<div class="search">
<input type="text" name="textfield" id="textfield" />
<input type="submit" name="button" id="button" value="" class="btn_search" />
热门搜索：<a href="#">蕾丝刺绣文胸</a> <a href="#">喜庆文胸</a> <a href="#">蝶形文胸</a> <a href="#">打底衫</a>
<a href="#">针织衫</a></div>
您好！欢迎光临康璐妮商城！请 <a href='Login.aspx'>
<input type="submit" value="登陆" class="btn_login" /></a> <a href='Reg.aspx'>
<input type="submit" value="注册" class="btn_login" /></a>
</div>
<div class="notice">
<h1>
网站公告：</h1>
<ul>
<li><a href="#">热烈祝贺湖南长沙店于9月13日盛大开业!</a><span>2010-09-15</span> </li>
<li><a href="#">热烈祝贺深圳观澜热烈祝贺深圳观澜店于9月12日盛大开业！</a><span>2010-09-15</span></li>
</ul>
</div>
</div>
<div id="container">
<ucLeft:LeftSeriesControl ID="ucLeftSeries" runat="server" />
<div class="main">
<div class="current">
<a href="#">首页</a>→新用户注册</div>
<div class="reg">
<table border="0" cellspacing="0" cellpadding="0" class="tb_reg">
<tr>
<td colspan="3" style="font-weight: bold;">
新用户注册
</td>
</tr>
<tr>
<td class="ltd">
用 户 名：
</td>
<td class="mtd">
<asp:TextBox ID="txtUName" runat="server"></asp:TextBox>
<span class="red">*</span>
<input type="button" value="检测用户名是否存在" onclick="CheckUser()" />
</td>
<td class="rtd">
</td>
</tr>
<tr>
<td>
密 码：
</td>
<td>
<asp:TextBox ID="txtPwd" runat="server" TextMode="Password"></asp:TextBox>
<span class="red">*</span>
</td>
<td>
</td>
</tr>
<tr>
<td>
确认密码：
</td>
<td>
<asp:TextBox ID="txtPwdAgain" runat="server" TextMode="Password"></asp:TextBox>
<span class="red">*</span>
</td>
<td>
</td>
</tr>
<tr>
<td>
邮箱：
</td>
<td>
<asp:TextBox ID="txtEmail" runat="server"></asp:TextBox>
<span class="red">*</span>
</td>
<td>
</td>
</tr>
<tr>
<td>
密码提示问题：
</td>
<td>
<asp:TextBox ID="txtQuestion" runat="server"></asp:TextBox>
<span class="red">*</span>
</td>
<td>
</td>
</tr>
<tr>
<td>
密码提示答案：
</td>
<td>
<asp:TextBox ID="txtAnswer" runat="server"></asp:TextBox>
<span class="red">*</span>
</td>
<td>
</td>
</tr>
</table>
<div>
<asp:Button ID="btnSubmit" runat="server" Text="确定" CssClass="btn_login" OnClick="btnSubmit_Click" />
<input type="reset" value="重置" class="btn_login" />
</div>
</div>
</div>
</div>
<div id="footer">
<div class="service">
<dl>
<dt>新手指南
<dd>
<a href="#">注册新用户</a></dd>
<dd>
<a href="#">网站订购流程</a></dd>
</dl>
<dl>
<dt>如何付款/退款 </dt>
<dd>
<a href="#">支付方式 </a>
</dd>
<dd>
<a href="#">如何办理退款</a></dd>
<dd>
<a href="#">发票制度说明</a></dd>
</dl>
<dl style="width: 171px;">
<dt>新手指南</dt>
<dd>
<a href="#">货到付款城市及配送时间</a></dd>
<dd>
<a href="#">款到快递城市及配送时间</a></dd>
<dd>
<a href="#">配送费收取标准</a></dd>
</dl>
<dl>
<dt>售后服务</dt>
<dd>
<a href="#">退换货政策</a></dd>
<dd>
<a href="#">如何办理退换货</a></dd>
</dl>
<dl>
<dt>帮助中心</dt>
<dd>
<a href="#">常见热点问题</a></dd>
<dd>
<a href="#">联系我们</a></dd>
<dd>
<a href="#">投诉与建议</a></dd>
</dl>
<p>
订购热线（免长途费）
<br />
<strong class="pink">400 000 0000</strong>
</p>
<p>
客户服务热线（免长途费）<br />
<strong class="pink">400 000 0000</strong>
</p>
</div>
<div class="copyright">
<div class="copy">
©2001～2010 All rights reserved</div>
本商店顾客个人信息将不会被泄漏给其他任何机构和个人 本商店logo和图片都已经申请保护，不经授权不得使用<br />
深圳市康璐妮内衣服饰有限公司 版权所有</div>
</div>
</form>
</body>
</html>
<%@ Register Src="UserControls/NavControl.ascx" TagName="NavControl" TagPrefix="ucNav" %>
<%@ Register Src="UserControls/LeftSeriesControl.ascx" TagName="LeftSeriesControl"
TagPrefix="ucLeft" %>
<!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>
<title>康璐妮COLOR NIGHT</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="康璐妮,colornight" />
<meta name="description" content="康璐妮" />
<link href="css/master.css" type="text/css" rel="stylesheet" />
<link href="css/login.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
var IsReged = false;
var Valid = {
//设置提示
SetTip: function(fun, tip) {
if (typeof (fun) == "function") {
var ele = fun();
} else {
var ele = fun;
}
ele.css({ color: "red", fontWeight: "bold" })
ele.html(tip);
},
//取消默认动作，例如表单提交
CancelDefault: function(ffEvent) {
if (window.event) {
event.returnValue = false;
} else {
if (ffEvent) {
ffEvent.preventDefault();
}
}
},
//判断某个元素的value值是否为空串
IsEmptyStr: function(id) {
return "" == $.trim(this.$(id).val());
},
$: function(id) {
return $("#" + id)
},
//验证字符串是不是合法的Email地址
IsEmail: function(str) {
return this.RegEmail.test(str);
},
RegEmail: /^\w+(-\w+)*@\w+(-\w+)*\.\w{2,4}$/
}
//扩展函数，找到提示元素，一般是根据元素之间的层级关系来寻找，根据不同的页面实现不同
Valid.FindTip = function(id) {
return this.$(id).parent().next();
}
//扩展函数，验证,根据不同的页面实现不同，检查某个文本框的值是不是为空串
Valid.CheckTxt = function(id, ffEvent, tip) {
if (Valid.IsEmptyStr(id)) {
this.$(id).focus();
this.SetTip(this.FindTip(id), tip);
this.CancelDefault(ffEvent);
//已经验证一个不合格，就不执行此次验证后面的代码
throw Error("终止验证");
} else {
this.SetTip(this.FindTip(id), "");
}
}
function Check(ffEvent) {
try {
Valid.CheckTxt("txtUName", ffEvent, "用户名不能为空");
Valid.CheckTxt("txtPwd", ffEvent, "密码不能为空");
Valid.CheckTxt("txtEmail", ffEvent, "Email不能为空");
Valid.CheckTxt("txtQuestion", ffEvent, "提示问题不能为空");
Valid.CheckTxt("txtAnswer", ffEvent, "提示答案不能为空");
if (!Valid.IsEmail(Valid.$("txtEmail").val())) {
Valid.SetTip(Valid.FindTip("txtEmail"), "邮箱格式不合法");
Valid.$("txtEmail").focus();
Valid.CancelDefault(ffEvent);
} else if (Valid.$("txtPwd").val().length < 6) {
Valid.SetTip(Valid.FindTip("txtPwd"), "密码长度不能短于6位");
Valid.$("txtPwd").focus();
Valid.CancelDefault(ffEvent);
}
else if (Valid.$("txtPwd").val() != Valid.$("txtPwdAgain").val()) {
Valid.SetTip(Valid.FindTip("txtPwdAgain"), "两次密码输入不一致");
Valid.$("txtPwdAgain").focus();
Valid.CancelDefault(ffEvent);
} else if (IsReged) {
Valid.SetTip(Valid.FindTip("txtUName"), "用户名已经被注册，请更换用户名");
Valid.$("txtUName").focus();
Valid.CancelDefault(ffEvent);
}
} catch (ex) {
}
}
//检测用户名是否已经存在
function CheckUser() {
if (Valid.IsEmptyStr("txtUName")) {
Valid.$("txtUName").focus();
Valid.SetTip(function() { return Valid.$("txtUName").parent().next(); }, "用户名不能为空");
} else {
$.ajax({ data: { uname: Valid.$("txtUName").val() }, type: "post", dataType: "text", url: "Reg.ashx", success: function(data) {
if (data == "1") {
Valid.SetTip(Valid.FindTip("txtUName"), "用户名可以被注册");
IsReged = false;
} else {
Valid.SetTip(Valid.FindTip("txtUName"), "用户名已经被注册，请更换用户名");
Valid.$("txtUName").focus();
IsReged = true;
}
}
})
}
}
</script>
<style type="text/css">
.ltd
{
width: 100px;
padding-left: 0;
}
.mtd
{
width: 170px;
}
.rtd
{
width: 230px;
}
.reg
{
margin: 0 auto;
width: 50%; /*
border: 1px solid red;*/
}
td
{
}
.tb_reg
{
width: 500px;
}
</style>
</head>
<body>
<form runat="server" onsubmit="Check(event);">
<div id="header">
<div class="logo" title="康璐妮COLOR NIGHT">
<a href="index.html">
<img src="images/logo.gif" width="222" height="96" /></a></div>
<div class="top_ctr">
<a href="goods_list.html" class="link_01">购物车</a><a href="member/member_manage.html"
class="link_02">我的帐户</a><a href="#" class="link_03">热门推荐</a><a href="#" class="link_04">特价优惠</a><a
href="#" class="link_05">新品上架</a><a href="#" class="link_06">积分促销</a>
</div>
<ucNav:NavControl ID="ucNavTop" runat="server" HoverIndex="-1" />
<div class="search_bar">
<div class="search">
<input type="text" name="textfield" id="textfield" />
<input type="submit" name="button" id="button" value="" class="btn_search" />
热门搜索：<a href="#">蕾丝刺绣文胸</a> <a href="#">喜庆文胸</a> <a href="#">蝶形文胸</a> <a href="#">打底衫</a>
<a href="#">针织衫</a></div>
您好！欢迎光临康璐妮商城！请 <a href='Login.aspx'>
<input type="submit" value="登陆" class="btn_login" /></a> <a href='Reg.aspx'>
<input type="submit" value="注册" class="btn_login" /></a>
</div>
<div class="notice">
<h1>
网站公告：</h1>
<ul>
<li><a href="#">热烈祝贺湖南长沙店于9月13日盛大开业!</a><span>2010-09-15</span> </li>
<li><a href="#">热烈祝贺深圳观澜热烈祝贺深圳观澜店于9月12日盛大开业！</a><span>2010-09-15</span></li>
</ul>
</div>
</div>
<div id="container">
<ucLeft:LeftSeriesControl ID="ucLeftSeries" runat="server" />
<div class="main">
<div class="current">
<a href="#">首页</a>→新用户注册</div>
<div class="reg">
<table border="0" cellspacing="0" cellpadding="0" class="tb_reg">
<tr>
<td colspan="3" style="font-weight: bold;">
新用户注册
</td>
</tr>
<tr>
<td class="ltd">
用 户 名：
</td>
<td class="mtd">
<asp:TextBox ID="txtUName" runat="server"></asp:TextBox>
<span class="red">*</span>
<input type="button" value="检测用户名是否存在" onclick="CheckUser()" />
</td>
<td class="rtd">
</td>
</tr>
<tr>
<td>
密 码：
</td>
<td>
<asp:TextBox ID="txtPwd" runat="server" TextMode="Password"></asp:TextBox>
<span class="red">*</span>
</td>
<td>
</td>
</tr>
<tr>
<td>
确认密码：
</td>
<td>
<asp:TextBox ID="txtPwdAgain" runat="server" TextMode="Password"></asp:TextBox>
<span class="red">*</span>
</td>
<td>
</td>
</tr>
<tr>
<td>
邮箱：
</td>
<td>
<asp:TextBox ID="txtEmail" runat="server"></asp:TextBox>
<span class="red">*</span>
</td>
<td>
</td>
</tr>
<tr>
<td>
密码提示问题：
</td>
<td>
<asp:TextBox ID="txtQuestion" runat="server"></asp:TextBox>
<span class="red">*</span>
</td>
<td>
</td>
</tr>
<tr>
<td>
密码提示答案：
</td>
<td>
<asp:TextBox ID="txtAnswer" runat="server"></asp:TextBox>
<span class="red">*</span>
</td>
<td>
</td>
</tr>
</table>
<div>
<asp:Button ID="btnSubmit" runat="server" Text="确定" CssClass="btn_login" OnClick="btnSubmit_Click" />
<input type="reset" value="重置" class="btn_login" />
</div>
</div>
</div>
</div>
<div id="footer">
<div class="service">
<dl>
<dt>新手指南
<dd>
<a href="#">注册新用户</a></dd>
<dd>
<a href="#">网站订购流程</a></dd>
</dl>
<dl>
<dt>如何付款/退款 </dt>
<dd>
<a href="#">支付方式 </a>
</dd>
<dd>
<a href="#">如何办理退款</a></dd>
<dd>
<a href="#">发票制度说明</a></dd>
</dl>
<dl style="width: 171px;">
<dt>新手指南</dt>
<dd>
<a href="#">货到付款城市及配送时间</a></dd>
<dd>
<a href="#">款到快递城市及配送时间</a></dd>
<dd>
<a href="#">配送费收取标准</a></dd>
</dl>
<dl>
<dt>售后服务</dt>
<dd>
<a href="#">退换货政策</a></dd>
<dd>
<a href="#">如何办理退换货</a></dd>
</dl>
<dl>
<dt>帮助中心</dt>
<dd>
<a href="#">常见热点问题</a></dd>
<dd>
<a href="#">联系我们</a></dd>
<dd>
<a href="#">投诉与建议</a></dd>
</dl>
<p>
订购热线（免长途费）
<br />
<strong class="pink">400 000 0000</strong>
</p>
<p>
客户服务热线（免长途费）<br />
<strong class="pink">400 000 0000</strong>
</p>
</div>
<div class="copyright">
<div class="copy">
©2001～2010 All rights reserved</div>
本商店顾客个人信息将不会被泄漏给其他任何机构和个人 本商店logo和图片都已经申请保护，不经授权不得使用<br />
深圳市康璐妮内衣服饰有限公司 版权所有</div>
</div>
</form>
</body>
</html>
