Ajax+JavaScript 发送数据

一般做无刷新，我们会采用Ajax+Jquery，异步发送和接受数据，如下：

$.ajax({

type:"POST",//发送请求的类型。典型的值是 GET 或 POST。

url:“Handler.ashx”,//发送到的页面

data:{index:currentPage;size:pageSize},//参数

success:function(msg){

var obj=eval(msg);

.......

//对数据进行处理

}

});

上面的代码是封装后的，发送和接收数据是在一起，很多时候，需要单独发送数据，那么该如何写呢？

可以使用Ajax+JavaScript来完成，如下：

//创建XMLHTTPRequest对象

var request=false;

try{

request=new XMLHttpRequest();

}catch(trymicrosoft){

         try{

         request=new ActiveXObject("Msxm12.XMLHTTP");

         }catch(othermicrosoft){

              try{

                 request=new ActiveXObject("Microsoft.XMLHTTP");

                }catch(failed){

                 request=false;

              }

      }

}

function  sedData(){

    var url=encodeURI("Handler.ashx?Index="+currentPage+"&size"+pageSize);

//     有了要连接的 URL 后就可以配置请求了。可以用 XMLHttpRequest 对象的 open() 方法来完成。该方法有五个参数:

//     request-type:发送请求的类型。典型的值是 GET 或 POST，但也可以发送 HEAD 请求。

//      url:要连接的 URL。

//     asynch:如果希望使用异步连接则为 true，否则为 false。该参数是可选的，默认为 true。

//     username:如果需要身份验证，则可以在此指定用户名。该可选参数没有默认值。

 //    password:如果需要身份验证，则可以在此指定口令。该可选参数没有默认值。

//　通常使用其中的前三个参数。事实上，即使需要异步连接，也应该指定第三个参数为 “true”。这是默认值，但坚持明确指定请求是异步的还是同步的更容易理解。

    request.open("POST",url,true);

      //在这里将 XMLHttpRequest 对象的 onreadystatechange 属性设置为要运行的函数名。这样，当服务器处理完请求后就会自动调用该函数。也不需要担心该函数的任何参数。

   request.onreadystatechange = updatePage;

     request.send(null);

}

//服务器回调函数

function updatePage(){

   if (request.readyState == 4)
       if (request.status == 200)
         alert("success!");
       else if (request.status == 404)
         alert("Request URL does not exist");
       else
         alert("Error: status code is " + request.status);

     }

以上便能完成异步发送数据。

另外，我们多了解一下Ajax的核心——XMLHttpRequest

XMLHttpRequest 对象
属性
readyState	请求状态，开始请求时值为0直到请求完成这个值增长到4
responseText	目前为止接收到的响应体,readyState<3此属性为空字符串，=3为当前响应体，=4则为完整响应体
responseXML	服务器端相应，解析为xml并作为Document对象返回
status	服务器端返回的状态码，=200成功，=404表示“Not Found”
statusText	用名称表示的服务器端返回状态，对于“OK”为200，“Not Found”为400
方法
setRequestHeader()	向一个打开但是未发生的请求设置头信息
open()	初始化请求参数但是不发送
send()	发送Http请求
abort()	取消当前相应
getAllResponseHeaders()	把http相应头作为未解析的字符串返回
getResponseHeader()	返回http相应头的值
事件句柄
onreadystatechange	每次readyState改变时调用该事件句柄，但是当readyState=3有可能调用多次