1.使用原生JavaScript实现
var xhr;
if (window.XMLHttpRequest) {
xhr = new XMLHttpRequest();
} else {
xhr = new ActiveXObject(“microsoft.XMLHTTP”);
}
xhr.open(‘GET’,’action’,true);
xhr.onreadystatechange = function(){
if (xhr.readyState== 4 && xhr.status==200) {
alert(responseText);
}
}
xhr.send(null);
2.使用jquery：
$(“#username”).bind(“blur”,function(){
var $this = $(this);
$.ajax({
url:”user_validateUsername?username=” + $(“#username”).val(),
dataType:”text”,
success:function(data){
$(“#username-error”).text(“用户名可用”);
}
})
});
3.使用Jquery的form表单验证框架
需要引入jquery.form.js及以来的jquery类库
//提交表单时使用ajax校验用户名
var options = {
url:”user_validateUsername?username=” + $(“#username”).val(),
target:”#username-error”
};
$(“#form”).ajaxForm(options);
4.使用Jquery的Validation框架
引入jquery.validate.js和messages_zh.js(optional)及jquery类库
$(“#registerForm”).validate({
debug:true,
rules:{
username:{
//使用remote进行单个元素的ajax验证
remote:{
url:”user_validateUsername.action”,
type:”post”,
dataType:”text”,
data:{
username: function(){
return $(“#username”).val();
}
},
dataFilter:function(data,type){
if(data == “true”){
return true;
}else{
return false;
}
}
}
}
}
});