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事件被触发5次,对应着readyState的每个变化

使用回调函数:

回调函数是一种以参数的形式传递给另一个函数的函数

如果页面存在多个AJAX任务,就应该为创建XMLHttpRequest对象编写一个标准的函数,并为每个AJAX任务调用该函数

该函数应该包含URL以及发生onreadystatechange事件执行时的任务

 <script>
var xmlhttp;
function loadXMLDoc(url,cfunc)
{
if (window.XMLHttpRequest)
{// IE7+, Firefox, Chrome, Opera, Safari 代码
xmlhttp=new XMLHttpRequest();
}
else
{// IE6, IE5 代码
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=cfunc;
xmlhttp.open("GET",url,true);
xmlhttp.send();
}
function myFunction()
{
loadXMLDoc("/try/ajax/ajax_info.txt",function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
});
}
</script>

[AJAX系列]onreadystatechange事件的更多相关文章

  1. Ajax 的onreadystatechange事件注意事项.

    <script type="text/javascript"> function createXHR() { var request = false; try { re ...

  2. [转]深入理解ajax系列——进度事件

    一般地,使用readystatechange事件探测HTTP请求的完成.XHR2规范草案定义了进度事件Progress Events规范,XMLHttpRequest对象在请求的不同阶段触发不同类型的 ...

  3. 深入理解ajax系列第一篇——XHR对象

    × 目录 [1]创建对象 [2]发送请求 [3]接收响应[4]异步处理[5]实例演示 前面的话 ajax是asynchronous javascript and XML的简写,中文翻译是异步的java ...

  4. [AJAX系列]XMLHttpRequest请求

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. ASP.NET之Ajax系列(三)

    我们通过前两篇文章的学习,已经大致掌握了Ajax的实现方法,同时也可以对比出两种方式的优劣.但是我们还是没有搞清楚真正的ajax的实现原理,以及最原始的,未经过封装的ajax是什么样的,今天我们一起来 ...

  6. ajax系列之用jQuery的ajax方法向服务器发出get和post请求

    打算写个ajax系列的博文,主要是写给自己看,学习下ajax的相关知识和用法,以更好的在工作中使用ajax. 假设有个网站A,它有一个简单的输入用户名的页面,界面上有两个输入框,第一个输入框包含在一个 ...

  7. Ajax系列之二:核心对象XMLHttpRquest

    版权声明:本文为博主原创文章,未经博主同意不得转载. https://blog.csdn.net/zhanghongjie0302/article/details/31432939           ...

  8. onreadystatechange()事件

    onreadystatechange(): 存储函数(或函数名),当 readyState 改变时,就会触发 onreadystatechange()  事件. xmlhttp.onreadystat ...

  9. 基于jQuery的ajax系列之用FormData实现页面无刷新上传

    接着上一篇ajax系列之用jQuery的ajax方法向服务器发出get和post请求写,这篇主要写如何利用ajax和FormData实现页面无刷新的文件上传效果,主要用到了jQuery的ajax()方 ...

随机推荐

  1. 关于/etc/rc.local以及/etc/init.d

    1. /etc/rc.local    这是使用者自订开机启动程序,把需要开机自动运行的程序写在这个脚本里   --------引用----------------------  在完成 run le ...

  2. HTTP状态码分类说明

    状态码分类 HTTP状态码被分为五大类, 目前我们使用的HTTP协议版本是1.1, 支持以下的状态码.随着协议的发展,HTTP规范中会定义更多的状态码. 小技巧:  假如你看到一个状态码518, 你并 ...

  3. union all 与order by的连用

    昨天工作过程中发现一个奇怪的地方: 代码段A: 1---select   *  from  table1 2---order  by  no 3---union  all 4---select   * ...

  4. Arch Linux sudo: PAM authentication error: Module is unknown [Solved!]

    问题描述: 我的 Arch Linux 已经用了快半年多,由于 Arch Linux 的滚挂问题,我从没有直接升级过系统.软件版本以及库自然落后了一些. 就在我准备需要用到 NFS 时,挂载网络文件系 ...

  5. Python搜索目录下指定的文件,并返回绝对路径(包括子目录)

    #!/usr/bin/python #coding=UTF-8 #FileName:search.py #文件搜索 import os; import sys; returnList = []; de ...

  6. 创建Windows Azure内部负载均衡器

    与普通的负载均衡器一样,Windows Azure内部负载均衡器也是四层的.内部负载均衡器会被分配一个内网地址,只能从虚拟网络内部访问,包括VPN和ExpressRoute. 内部负载均衡器通常被用于 ...

  7. POJ3967Ideal Path[反向bfs 层次图]

    Ideal Path Time Limit: 10000MS   Memory Limit: 65536K Total Submissions: 1754   Accepted: 240 Descri ...

  8. 第9章 用内核对象进行线程同步(1)_事件对象(Event)

    9.1 等待函数 (1)WaitForSingleObject(hObject,dwMilliseonds); ①dwMilliseconds为INFINITE时表示无限等待 ②dwMilliseco ...

  9. dp入门问题

    昨天晚上的rank彻底废了..一个星期没敲代码完全没手感.作为总结,贴一道昨天浪费了我两小时的dp.http://acm.dirring.com/problem.php?cid=1003&pi ...

  10. Java之反射机制

    一:基本概念:在Java运行时,对于任意一个类,能否知道这个类对应的属性和方法?对于一个对象,能否知道可以调用它的哪些方法?YES! 这种动态获取类的信息以及动态调用对象的方法的功能来自于Java语言 ...