需求:做一个ajax登录
主要技术点:jquery ajax以及blur事件
当用户名输入框失去焦点的时候就会触发blur事件,然后进行ajax请求,获得结果(true或者false),如果请求结果为true,就把用户名输入框图片替换成ok,并且输出文字:恭喜您, 这个帐号可以注册,否则就替换成图片no,并且输出文字:账号已存在
源代码:
前台:
代码如下:
<%@ Page Language=”C#” MasterPageFile=”~/Top_Down。
master” AutoEventWireup=”true” CodeFile=”RegisterMember。aspx。cs”Inherits=”Member_RegisterMember” Title=”注册用户” %>
<asp:Content ID=”Content1″ ContentPlaceHolderID=”head” Runat=”Server”>
<link href=”。
/Admin/css/template。css” rel=”stylesheet” type=”text/css” />
<link href=”。/Admin/css/validationEngine。jquery。
css” rel=”stylesheet” type=”text/css” />
<script src=”。/Admin/scripts/jquery-1。7。1。min。js” type=”text/javascript”></script>
<script src=”。
/js/jquery。validationEngine。js” type=”text/javascript”></script>
<script src=”。/Admin/scripts/isValid。
js” type=”text/javascript”></script>
<script src=”。/js/languages/jquery。validationEngine-zh_CN。js” type=”text/javascript”></script>
<script type=”text/javascript”>
var IsCheck=false;
$(function(){
// binds form submission and fields to the validation engine
$(“#form1”)。
validationEngine();
//当鼠标失去焦点的时候验证
$(“#txtUserName”)。blur(function(){
$。ajax({
url:”Data/GetMemberInfo。
ashx?method=CheckExistUserName”,
data:{“username”:$(“#txtUserName”)。val()},
type:”post”,
success:function(text){
$(“#tdUser”)。
empty();//清空内容
var item;
if(text==”True”){
item='<img src=”。/images/ok。png”/>恭喜您,这个帐号可以注册!’;
IsCheck=true;
}
else
item='<img src=”。
/images/no。png”/>对不起,这个帐号已经有人注册了!’;
$(“#tdUser”)。append(item);
}
});
});
});
function CheckForm1()
{
if(IsCheck)
{
form1。
submit();
}
else{
alert(“请验证用户名”);
}
}
</script>
</asp:Content>
<asp:Content ID=”Content2″ ContentPlaceHolderID=”ContentPlaceHolder1″ Runat=”Server”>
<form>ashx?method=SaveMemberInfo” method=”post”>
<div><div><div></div>
<div><div><div><table width=”578″><tr>
<td width=”93″><td width=”200″></td>
<td width=”269″></tr>
<tr>
<td><td><td></tr>
<tr>
<td><td><td></tr>
<tr>
<td><td><td></tr>
<tr>
<td><td>/Admin/FileManage/VerifyChars。ashx” alt=”验证码” /></td>
</tr>
<tr><td></td></tr>
<tr>
<td colspan=”3″ align=”center”><a href=”javascript:CheckForm1()”><img src=”。
/images/zhuce_sumbit。png” /></a></td>
</tr>
</table>
</div>
</div>
</div>
</form>
</asp:Content>
后台事件:
代码如下:
<%@ WebHandler Language=”C#” Class=”GetMemberInfo” %>
using System;
using System。
Web;
using Common;
using czcraft。Model;
using czcraft。BLL;
using System。Web。SessionState;
public class GetMemberInfo : IHttpHandler,IRequiresSessionState
{
// //记录日志
private static readonly log4net。
ILog logger =log4net。LogManager。GetLogger(System。Reflection。MethodBase。GetCurrentMethod()。DeclaringType);
public void ProcessRequest(HttpContext context)
{
String methodName = context。
Request[“method”];
if (!string。IsNullOrEmpty(methodName))
CallMethod(methodName, context);
}
/// <summary>
/// 根据业务需求调用不同的方法
/// </summary>
/// <param name=”Method”>方法</param>
/// <param name=”context”>上下文</param>
public void CallMethod(string Method, HttpContext context)
{
switch (Method)
{
case “CheckExistUserName”:
CheckExistUserName(context);
break;
//case “SearchMember”:
// SearchMember(context);
// break;
case “SaveMemberInfo”:
SaveMemberInfo(context);
break;
//case “RemoveMember”:
// RemoveMember(context);
// break;
//case “GetMember”:
// GetMember(context);
// break;
default:
return;
}
}
/// <summary>
/// 验证帐号是否存在
/// </summary>
/// <param name=”context”></param>
public void CheckExistUserName(HttpContext context)
{
string username = context。
Request[“username”];
if (Tools。IsValidInput(ref username, true))
{
context。Response。Write(new memberBLL()。
CheckExistUserName(username));
}
}
/// <summary>
/// 保存用户信息
/// </summary>
/// <param name=”context”></param>
public void SaveMemberInfo(HttpContext context)
{
try
{
//表单读取
string txtUserName = context。
Request[“txtUserName”];
string txtPwd = context。Request[“txtPwd”];
string txtEmail = context。Request[“txtEmail”];
string txtCheckCode = context。
Request[“txtCheckCode”];
//验证码校验
if (!txtCheckCode。Equals(context。Session[“checkcode”]。ToString()))
{
return;
}
//字符串sql注入检测
if (Tools。
IsValidInput(ref txtUserName, true) && Tools。IsValidInput(ref txtPwd, true) && Tools。IsValidInput(ref txtEmail, true))
{
member info = new member();
info。
username = txtUserName;
info。password = txtPwd;
info。Email = txtEmail;
info。states = “0”;
if (new memberBLL()。
AddNew(info) > 0)
{
SMTP smtp = new SMTP(info。Email);
string webpath = context。Request。Url。
Scheme + “://” + context。Request。Url。Authority + “/Default。aspx”;
smtp。Activation(webpath, info。username);//发送激活邮件
JScript。
AlertAndRedirect(“注册用户成功!”, “。/Default。aspx”);
}
else {
JScript。AlertAndRedirect(“注册用户失败!”, “。
/Default。aspx”);
}
}
}
catch (Exception ex)
{
logger。
Error(“错误!”, ex);
}
}
public bool IsReusable {
get {
return false;
}
}
}

相关推荐