详解ajax基本原理以及工作流程(2)_H5之家 - 中国HTML5教程资源分享第一站

指定响应处理函数。指定当服务器返回信息时客户端的处理方式，相应的处理函数名称赋给XMLHttpRequest 对象的onreadystatechange属性。例如：

httpRequest.onreadystatechange = request_readystatechange; 6.2发送请求

发出HTTP 请求。指定响应处理函数之后，就可以向服务器发出HTTP 请求。这一步调用XMLHttpRequest 对象的open 和send 方法。

httpRequest.open('GET','',true); httpRequest.send(null);

open 的第一个参数是HTTP 请求的方法，为GET或POST。

open 的第二个参数是目标URL。open 的第三个参数如果为True:异步请求；false:同步请求。默认为True

6.3服务器接收 6.4服务器返回

返回的数据类型为：XML

6.5客户端接受

处理服务器返回的信息。首先，它要检查XMLHttpRequest 对象的readyState 值，判断请求的当前状态。

服务器返回信息后，还需要判断返回的HTTP 状态码，确定返回的页面没有错误。所有的状态码都可以在W3C 的官方网站上查到。其中，200 代表页面正常。

封装一个类，用来完成XMLHttpRequest对象的创建及信息的发送，这样，异步求情将变得很简单。需要异步请求时，只需实例化一个该类的对象即可。

代码如下：

//sUrl:URL //fpCallback:客户端处理函数 /**************************封装XMLHttpRequest类*****************************/ function HttpRequest(sUrl,fpCallback){ this.request = this.createXmlHttpRequest(); this.request.open("GET",sUrl,true); var tempRequest = this.request; function request_readystatechange(){ if(tempRequest.readyState == 4){ if(tempRequest.status == 200){ fpCallback(tempRequest.responseText); }else{ document.write("获取数据失败"); } }else{ //alert("连接失败"); } } this.request.onreadystatechange = request_readystatechange; } //通过prototype给类HttpRequest添加方法 HttpRequest.prototype.createXmlHttpRequest = function(){ if(window.XMLHttpRequest){ var oHttp = new XMLHttpRequest(); return oHttp; }else if(window.ActiveXObject){ var versions = ["MSXML2.XmlHttp.6.0","MSXML2.XmlHttp.3.0"]; for(var i=0;i<versions.length;i++){ try{ var oHttp = new ActiveXObject(versions[i]); return oHttp; }catch(error){ //do nothing here } } } return null; } HttpRequest.prototype.send = function(){ this.request.send(null); } /**************************封装XMLHttpRequest类*****************************/

例如：

//异步请求 var url = "/login/data/ajax/username_multiple_check.php?txtEmail=" + emailObj.value; //创建一个HttpRequest对象，传递一个URL和一个方法名 var ajaxRequest = new HttpRequest(url,checkUserIsExist); ajaxRequest.send(); 8.返回的是请求页面上输出的内容，并以XML文档的形式存储。

分享给小伙伴们：

本文标签： ajax/">ajax

发表评论愿您的每句评论，都能给大家的生活添色彩，带来共鸣，带来思索，带来快乐。

本类最热新闻