ajax

使用ajax其实就是运用XMLHttpRequest与Web服务器端进行数据的异步交换

一般来说，浏览器都支持xhr对象，单IE5，IE6不支持，所以创建对象时如下：

var request;

if(window.XMLHttpRequest)

{

　　request=new XMLHttpRequest();

}

else

{

　　request=new ActiveXObject("Miscrosoft.XMLHttp");

}

此处介绍下Http请求中的状态码：

1XX：信息类，表示Web浏览器请求进一步处理中

2XX：表示成功，如200

3ＸＸ：表示重定向，请求不成功，用户需要采取进一步动作

４ＸＸ：客户端错误，输入信息有误，如４０４　not found

５ＸＸ：服务器错误，无法完成客户请求，如５００

XMLHttpRequest发送请求：

open（method，url,async）第三个参数表示是异步还是同步，默认是true，method有两种，get和post，get是安全的一种方式，因为用get一般是获取信息，被称为所谓的幂等，即get1000次和get1次效果是一样的，不会产生任何质的改变，post方法一般用户增删改查。所以send方法一般会带上参数

send（string）

//

request.open("get","get.php",true)

request.send();

//

request.open("post","news.php",true);

request.setRequestHeader("Content-type","application/x-www-form-urlencoded");//设置头部信息，告诉Web服务器，这是一个post请求

request.send(“name='王伟'&& age=12”);

下面XMLHttpRequest获得响应：

responseText 获取字符串信息

responseXML 获取XML格式信息

status或statusText，以数字、字符串形式获取状态码

getAllResponseHeader（） 获取所有响应报头

getResponseHeader（传入参数）查询响应中某个字段的 值

有一个属性readyState非常重要，当=0：请求未初始化，open还没有调用

1：服务器成功连接，调用open

2：接收了头信息

3：接收了响应主体

4：请求完成

那么如何监听这个属性呢：

request.onreadystatechange=function(){

　　if(request.readtState===4 && request.status===200){

　　　　.....request.responseText

　　}

}

 

那么其实我们平常项目中写ajax时，并不会每次都写如此麻烦的代码，因为有一些js分装了ajax，实现简单运用ajax，这里介绍jQuery的ajax：

$.ajax([seeting]);

type：GET或POST ,默认get

url:服务器端请求地址

data：连同请求发送给服务器的数据

dataType：预期服务器返回的数据类型，可以不指定，默认json格式

success，是个函数，请求成功后调用此方法，参数是一些返回数据，参数等

error，函数，请求失败时调用此方法，传入参数是一个XHR对象

还有很多其他参数值

下面以post为例,这里ajax采用json格式，即在服务器端，返回的数据是以json的格式，以PHP为例，echo“{“success”:true,"msg":"查找成功！"}”

$.ajax({

　　type:"POST",

　　url:"service,php",

　　data:{name:$("#username").val(),age:$("#age").val()

　　},

　　dataType:"json",

　　success:function(data)
　　{

　　if(data.succcess)

　　{$("#rersult").html(data.msg);

　　}

　　else{$("#rersult").html("出现错误"+data.msg);}

　　　　

　　}，error:function(XHRobj)

　　{

　　　　alert(XHRobj.status);

　　}

});