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. Configure Ocserv on CentOS 6

    Configure Ocserv on CentOS 6 Table of Contents 1. Install ocserv 2. Configure ocserv 3. How to host ...

  2. LINUX下NFS系统的安装配置

    准备:NFS系统服务器IP 192.168.135.1 ,NFS共享目录/mnt/NFS 一.安装NFS 查看nfs是否安装 #rpm -qa | grep nfs 若没有则安装nfs包 #yum i ...

  3. MMORPG大型游戏设计与开发(概述)updated

    1.定义 MMORPG,是英文Massive(或Massively)Multiplayer Online Role-PlayingGame的缩写,即大型多人在线角色扮演游戏. 2.技术与知识 在这系列 ...

  4. 使用Windows Azure的VM安装和配置CDH搭建Hadoop集群

    本文主要内容是使用Windows Azure的VIRTUAL MACHINES和NETWORKS服务安装CDH (Cloudera Distribution Including Apache Hado ...

  5. CF 676B Pyramid of Glasses[模拟]

    B. Pyramid of Glasses time limit per test 1 second memory limit per test 256 megabytes input standar ...

  6. AC日记——数1的个数 openjudge 1.5 40

    40:数1的个数 总时间限制:  1000ms 内存限制:  65536kB 描述 给定一个十进制正整数n,写下从1到n的所有整数,然后数一下其中出现的数字“1”的个数. 例如当n=2时,写下1,2. ...

  7. java 24 - 5 GUI之 鼠标移动改变窗体背景颜色

    需求: 创建一个可改变背景颜色的窗口,鼠标移动到按钮上,窗口背景就会改变成特定的颜色 步骤: (大致上) 创建窗口对象 创建按钮对象 添加按钮到窗口中 设置窗口关闭监听事件 设置鼠标进入按钮区域的监听 ...

  8. android 下载文件

    import com.example.android.R; import android.app.Activity;import android.os.Bundle;import android.os ...

  9. iOS UIControl 详解

    UIControl是UIView的子类,当然也是UIResponder的子类.UIControl是诸如UIButton,UISwitch,UItextField等控件的父类,它本身包含了一些属性和方法 ...

  10. jquery的ready方法(DOM是否加载完)详解与使用

    jquery的ready方法(准备DOM触发)还是比较复杂的,我们先看流程图: