AJAX校验用户名是否存在,焦点离开用户名、点击 【 检 查用户名 】的校验。分别用 XMLHttp 和 JQueryAJAX实现。

时间:2024-01-19 13:20:50

 XMLHttp方法:

$("#name").blur(function () {
var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); //创建HMLHTTP对象,相当于WebClient
if (!xmlhttp) {
alert("创建xmlhttp异常!");
return false;
}

var name = escape($(this).val());
//注意传值的时候参数如果是中文,要编码
xmlhttp.open("POST","/admin/IsNameExist.ashx?name=" + name, false); //准备向服务器的IsNameExist发出Post请求。
//XMLHTTP默认(也推荐)不是同步请求的,也就是open方法并不像webclient的DownLoadString那样把服务器返回的数据拿到才返回,是异步的,因此需要监听onreadystatechange事件
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4) {
if (xmlhttp.status == 200) {
if (xmlhttp.responseText == "true") {
$("#IsExist").hide();
}
else if (xmlhttp.responseText == "false") {
$("#IsExist").show();
}

}
else {
alert("AJAX服务器返回错误!!");
}
}
}
xmlhttp.send();//这时才开始发送请求

})
})

JQueryAJAX实现

// $("#name").blur(function () {
// var name = $(this).val();
// $.post("/admin/IsNameExist.ashx", { "name": name }, function (data, status) {
// //注意事项:此处的路径问题,还有控件的值是.val()
// if (status == "success") {
// if (data == "true") {
// $("#IsExist").hide();
// }
// else if (data == "false") {

// $("#IsExist").show();

// }
// }
// else {
// alert("数据查询有问题!");
// }
// });
// })