`
廖世勇
  • 浏览: 90586 次
  • 性别: Icon_minigender_1
  • 来自: 湖南郴州
社区版块
存档分类
最新评论

AJAX - onreadystatechange 事件

 
阅读更多

AJAX - onreadystatechange 事件

·Previous Page

·Next Page

onreadystatechange 事件

当请求被发送到服务器时,我们需要执行一些基于响应的任务。

每当 readyState 改变时,就会触发onreadystatechange 事件。

readyState 属性存有 XMLHttpRequest 的状态信息。

下面是 XMLHttpRequest 对象的三个重要的属性:

属性

描述

onreadystatechange

存储函数(或函数名),每当 readyState 属性改变时,就会调用该函数。

readyState

存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。

· 0: 请求未初始化

· 1: 服务器连接已建立

· 2: 请求已接收

· 3: 请求处理中

· 4: 请求已完成,且响应已就绪

status

200: "OK"

404: 未找到页面

在 onreadystatechange 事件中,我们规定当服务器响应已做好被处理的准备时所执行的任务。

当 readyState 等于 4 且状态为 200 时,表示响应已就绪:

xmlhttp.onreadystatechange=function()

{

if (xmlhttp.readyState==4 &&xmlhttp.status==200)

{

document.getElementById("myDiv").innerHTML=xmlhttp.responseText;

}

}

亲自试一试

注释:onreadystatechange 事件被触发 4 次,对应着 readyState 的每个变化。

使用 Callback 函数

callback 函数是一种以参数形式传递给另一个函数的函数。

如果您的网站上存在多个 AJAX 任务,那么您应该为创建XMLHttpRequest 对象编写一个标准的函数,并为每个 AJAX 任务调用该函数。

该函数调用应该包含 URL 以及发生onreadystatechange 事件时执行的任务(每次调用可能不尽相同):

functionmyFunction()

{

loadXMLDoc("ajax_info.txt",function()

{

if (xmlhttp.readyState==4 &&xmlhttp.status==200)

{

document.getElementById("myDiv").innerHTML=xmlhttp.responseText;

}

});

}

亲自试一试

来自:http://www.w3school.com.cn

分享到:
评论

相关推荐

    WEB开发 之 AJAX - onreadystatechange 事件.docx

    WEB开发 之 AJAX - onreadystatechange 事件.docx

    AJAX – onreadystatechange 事件

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

    ajax教程 在线视频培训教程(含课程源代码)

    创建 XMLHttpRequest 对象04-使用phpstorm工具来开发05-Get方法和读取中文乱码解决06-Post方法和小坑的解决07-XMLHttpRequest请求知识点08-读取xml文件和缓存的清除09-onreadystatechange事件回调函数10-AJAX PHP...

    Simple-Ajax-:Ajax 是一个非常强大的概念,可以动态访问数据。 老实说,它正在成为 web 2.0 的标准。 我创建了一个非常轻量级的代码,通过一个函数和两个参数通过 Ajax 发送接收数据

    简单-Ajax- Ajax 是一个非常强大的概念,可以动态访问数据。... } ajaxQuester.onreadystatechange = function caller(){ if(ajaxQuester.readyState == 4 && ajaxQuester.status == 200){ document.g

    Ajax技术课件,保密资料下载

    xhr.onreadystatechange ---- 事件监听属性 xhr.onreadystatechange=function(){ if(xhr.readyState==4&&xhr.status==200){ xxxxx } } xhr.status 返回结果的状态码 200 正常返回的状态码 404 500 ...

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

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

    Ajax 给 XMLHttpReq.onreadystatechange传递参数

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

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

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

    PHP+Ajax实例+注释演示

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

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

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

    ajax异步请求小结

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

    关于ajax的多次请求问题

    (比如说:ajax 的 onreadystatechange 事件就会触发多次;这是因为 onreadystatechange 是一个事件句柄。 它的值 (state_Change) 是一个函数的名称,当 XMLHttpRequest 对象的状态发生改变时,会触发此函数。 状态...

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

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

    ajax,javascript

    //设置回调函数,每当 readyState 改变时,就会触发 onreadystatechange 事件。 d.request.setRequestHeader("Content-Type","application/x-www-form-urlencoded");//如果带参数,请求头文件 e.request.send(u); /...

    Ajax最简单例子Demo

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

    ajax知识网络图 .xmind格式

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

    一个简单的Ajax框架

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

    javascript中ajax应用

    script> function hq () ... xml.onreadystatechange=function()//件可指定一个事件处理函数来处理XMLHttpRequest对象的执行结果 {if(xml.readyState==4&&xml.status==200)//当前状态是已结束时和请求成功时

Global site tag (gtag.js) - Google Analytics