ajax的四种,ajax的四种实现方式介绍

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;

}

}

}

}

}

});

打开App，阅读手记