`
董宗磊
  • 浏览: 64475 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

Ajax里的onreadystatechange的作用

阅读更多

发送一个请求后,客户端无法确定什么时候会完成这个请求,所以需要用事件机制来捕获请求的状态,XMLHttpRequest对象提供了onreadyStateChange事件实现这一功能。这类似于回调函数的做法。 
onreadyStateChange事件可指定一个事件处理函数来处理XMLHttpRequest对象的执行结果,如: 
ajaxObj=createAjaxObject(); 
var url="/MyTodoes/FetchText?id="+id; 
ajaxObj.open("Get",url,true); 
ajaxObj.onreadyStateChange=changeTabCallBack; 
ajaxObj.send(null); 


onreadyStateChange事件是在readyState属性发生改变时触发的,readyState的值表示了当前请求的状态,在事件处理程序中可以根据这个值来进行不同的处理。 readyState有五种可取值0:尚未初始化,1:正在加载,2:加载完毕,3:正在处理;4:处理完毕。一旦readyState属性的值变成了4,就可以从服务器返回的响应数据进行访问了。 
通常在事件中判断readyState的值是在请求完毕时才做处理,如: 
function changeTabCallBack(){ 
if(ajaxObj.readyState==4){ 
// 下一步验证 



Status存储了服务器端返回的Http请求响应代码,它表示请求的处理结果,常见响应代码的含义如右。 
在Ajax开发中,最常用就是200这个响应码,代码如下: 
function changeTabCallBack(){ 
if(ajaxObj.readyState==4){ 
if(ajaxObj.status==200){ 
// 服务端返回了正确数据,开始响应处理 



Http状态码 含义 
200 请求成功 
202 请求被接受但处理未完成 
400 错误请求 
404 请求资源未找到 
500 内部服务器错误

分享到:
评论

相关推荐

    WEB开发 之 AJAX - onreadystatechange 事件.docx

    WEB开发 之 AJAX - onreadystatechange 事件.docx

    AJAX – onreadystatechange 事件

    AJAX – onreadystatechange 事件 onreadystatechange 事件 当请求被发送到服务器时,我们需要执行一些基于响应的任务。 每当 readyState 改变时,就会触发 onreadystatechange 事件。 readyState 属性存有 ...

    Ajax 给 XMLHttpReq.onreadystatechange传递参数

    主要介绍了Ajax如何给XMLHttpReq.onreadystatechange =函数传递参数,需要的朋友可以参考下

    firefox下对ajax的onreadystatechange的支持情况分析

    firefox下对ajax的onreadystatechange的支持分析。用的到的朋友可以参考下。

    ajax提交实例,含防止连续提交的功能

    ajax.onreadystatechange = function(){ if (ajax.readyState == 4){getinfo = ajax.responseText; if(getinfo!=""){ckreview=0;alert(getinfo);}else{ckreview=0; alert("发送成功"); } } } } ...

    AJax 学习笔记二(onreadystatechange的作用)

    当发送一个请求后,客户端无法确定什么时候会完成这个请求,所以需要用事件机制来捕获请求的状态XMLHttpRequest对象提供了onreadyStateChange事件实现这一功能。这类似于回调函数的做法。onreadyStateChange事件可...

    ajax异步请求小结

    onreadystatechange 绑订事件处理函数(处理readystatechange事件)。 注:当readyState属性值发生了任何的改变,比如从0变成了1,就会产生readystatechange事件。 readyState 有五个值(0,1,2,3,4),表示ajax对象与...

    PHP+Ajax实例+注释演示

    3.2,用onreadystatechange来指定数据装载的方式.(onreadystatechange是一个异步响应事件,就是因为它,ajax才那么完美.onreadystatechange事件中可以接收到服务器传回来的数据,通过分析和利用这些数据从而完成...

    ajax知识网络图 .xmind格式

    Ajax 作用: 后台与服务器进行少量数据交换,实现异步更新 使用步骤: 创建XMLHttpRequest对象:var xhr = new XMLHttpRequest(); 给定请求方式与请求地址:xhr.open(“get”,“www.example.com”); 发送请求:xhr....

    原生JS实现ajax与ajax的跨域请求实例

    一、原生JS实现ajax 第一步获得XMLHttpRequest对象 第二步:设置状态监听函数 第三步:open一个连接,true是异步请求 第四部:send一个请求,可以发送一...ajax.onreadystatechange = function(){ console.log(ajax.r

    Ajax最简单例子Demo

    Ajax最简单例子,一个例子让你明白Ajax原理,XMLHttpRequest原理 var http_request = false; function createRequest(url) { http_request = false; if (window.XMLHttpRequest) { // Mozilla浏览器 ...

    一个简单的Ajax框架

    一个简单的Ajax框架: ... req.onreadystatechange=function(){ if (req.readyState == 4) { if (req.status == 200) { success(req); } else{ failure(req); } } }; req.send(null); }

    PHP100视频教程 48:Ajax PHP快速上手及应用.rar

    软件介绍 1、ajax是什么及其工作原理 Ajax 由 HTML、JavaScript? 技术、DHTML 和 DOM 组成,这一杰出的 方法可以将笨拙的 Web 界面转化成交互性的...XMLHttpRequest.onreadystatechange XMLHttpRequest.responseText

    可用 js ajax代码

    xmlHttp.onreadystatechange=userName; xmlHttp.send(null); } else { return; } } function changeDrop(field) { var typeid=field.value; if(""!=name) { xmlHttp=createXmlHttpRequest(); var ...

    Ajax原理分析及其实现的简单代码

    让更多人了解ajax技术.function _open(requestUrl) { var xmlHttp = false; var versions = ['Microsoft.XMLHTTP', 'MSXML.XMLHTTP', 'Microsoft.XMLHTTP', 'Msxml2.XMLHTTP.7.0', 'Msxml2.XMLHTTP.6.0', 'Msxml2....

    一个客户端的验证小程序ajax

    一个客户端的验证小程序ajax function Go() { //第一步 初始化 createXMLHttpRequest(); //第二步 取得表单中需要的数据 var newName =document.f3.uname.value; //第三步 建立要连接的URL并打开服务器的...

    asp+ajax静态分页

    function createAjax() { //该函数将返回XMLHTTP对象实例 var _xmlhttp; try { _xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); //IE的创建方式 } catch (e) { try { _xmlhttp=new XMLHttpRequest...

Global site tag (gtag.js) - Google Analytics