jquery.ajax异步发送请求的简单测试

使用ajax异步发送请求到一般处理程序，判断输入的用户名和密码

1.添加Html页面，导入jquery

2.编写js代码和页面标签

<script type="text/javascript">
$(function () {   //窗体加载
document.getElementById("txtUserName").onblur = function () //用户名文本框的光标离开事件
{

//ajax方法
$.ajax({
type:'Post', //请求方式为Post
url: 'HandlerRegister.ashx', //把请求发送到项目里的HandlerRegister.ashx中
data: { "name": $("#txtUserName").val() },  //"name"为后台中定义的   string name = context.Request.Params["name"].Trim().ToString();
success: function (data) //设置回调函数
{
if (data == 1) {
$("#span1").css('display', 'block');
$("#span2").css('display', 'none');
}
else
{
$("#span2").css('display', 'block');
$("#span1").css('display', 'none');

}
}
})

}
//密码是否一致并注册
document.getElementById("txtPassWord1").onblur = function ()  //不想再写一个button按钮了。。。在这里写的是光标离开事件
{
$.ajax({
type: 'post',
url: 'Handler1.ashx',
data: {"username":$("#txtUserName").val(),"pwd":$("#txtPassWord").val(),"pwd1":$("#txtPassWord1").val() },
success: function (data)
{
if (data == 1) {
alert("注册成功");
}
else
{
alert("注册失败");
}
}
})
}

})

</script>

前台：

用户名: <input type="text" id="txtUserName" name="txtUserName" />
<span id="span1" style="color:red;display:none">用户名可用</span>
<span id="span2" style="color:red;display:none">用户名不可用</span>
<br />
密码: <input type="password" id="txtPassWord" name="txtPassWord" /><br />
确认密码: <input type="password" id="txtPassWord1" name="txtPassWord1" /><br />

3.添加一般处理程序，编写代码如下

判断输入的密码:

public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";

string username = context.Request.Params["username"].Trim().ToString();
string pwd = context.Request.Params["pwd"].Trim().ToString();
string pwd1 = context.Request.Params["pwd1"].Trim().ToString();

if (pwd == pwd1&&pwd!=""&&pwd1!=null)
{
context.Response.Write();
}
else
{
context.Response.Write();
}

}

//判断用户名

public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";

string name = context.Request.Params["name"].Trim().ToString();

//在这里可以把admin换成从数据库中读取的数据
if ("admin".Equals(name))
{
context.Response.Write();
}
else
{
context.Response.Write();
}
}