[AJAX系列]onreadystatechange事件
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事件的更多相关文章
- Ajax 的onreadystatechange事件注意事项.
<script type="text/javascript"> function createXHR() { var request = false; try { re ...
- [转]深入理解ajax系列——进度事件
一般地,使用readystatechange事件探测HTTP请求的完成.XHR2规范草案定义了进度事件Progress Events规范,XMLHttpRequest对象在请求的不同阶段触发不同类型的 ...
- 深入理解ajax系列第一篇——XHR对象
× 目录 [1]创建对象 [2]发送请求 [3]接收响应[4]异步处理[5]实例演示 前面的话 ajax是asynchronous javascript and XML的简写,中文翻译是异步的java ...
- [AJAX系列]XMLHttpRequest请求
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- ASP.NET之Ajax系列(三)
我们通过前两篇文章的学习,已经大致掌握了Ajax的实现方法,同时也可以对比出两种方式的优劣.但是我们还是没有搞清楚真正的ajax的实现原理,以及最原始的,未经过封装的ajax是什么样的,今天我们一起来 ...
- ajax系列之用jQuery的ajax方法向服务器发出get和post请求
打算写个ajax系列的博文,主要是写给自己看,学习下ajax的相关知识和用法,以更好的在工作中使用ajax. 假设有个网站A,它有一个简单的输入用户名的页面,界面上有两个输入框,第一个输入框包含在一个 ...
- Ajax系列之二:核心对象XMLHttpRquest
版权声明:本文为博主原创文章,未经博主同意不得转载. https://blog.csdn.net/zhanghongjie0302/article/details/31432939 ...
- onreadystatechange()事件
onreadystatechange(): 存储函数(或函数名),当 readyState 改变时,就会触发 onreadystatechange() 事件. xmlhttp.onreadystat ...
- 基于jQuery的ajax系列之用FormData实现页面无刷新上传
接着上一篇ajax系列之用jQuery的ajax方法向服务器发出get和post请求写,这篇主要写如何利用ajax和FormData实现页面无刷新的文件上传效果,主要用到了jQuery的ajax()方 ...
随机推荐
- ES6新增值比较函数Object.is
在这之前我们比较值使用两等号 “==” 或 三等号“===”, 三等号更加严格,只要比较两方类型不同立即返回false. 另外,有且只有一个值不和自己相等,它是NaN 现在ES6又加了一个Object ...
- 【JAVA小结】字符串比较是否相等
public class CompareObject1 { public static void main(String[] args) { String str1 = new String(&quo ...
- 三:shell运算符
1:declare命令 shell默认是字符串型 如果需要加减乘除,需要定义为整型declare命令:改变默认变量的类型decalre [+/-] [选项] 变量名 -给变量 ...
- [转]Backbone.js简单入门范例
本文转自:http://dmyz.org/archives/598 11年刚开始用前端MVC框架时写过一篇文章,当时Knockout和Backbone都在用,但之后的项目全是在用Backbone,主要 ...
- tomocat设置首次访问时的页面
怎么设置Tomcat服务器的默认首页(欢迎页) 一般做Java web开发,有时候会选择Tomcat用作服务器,我在本机开发测试用的也是Tomcat,现在有一个问题是,我们都知道当访问一个网站的时候, ...
- lgy -oracle
PL/SQL Developer 和 instantclient客户端安装配置(图文) 一: PL/SQL Developer 安装 下载安装文件安装,我这里的版本号是PLSQL7.1.4.1391, ...
- 无法安装 DotNetCore.1.0.0-VS2015Tools.Preview2解决方法
安装 DotNetCore.1.0.0-VS2015Tools.Preview2,已经安装vs2015update3,还是提示检测到 Visual Studio 2015 Update 3没有完全安装 ...
- Python的高级特性10:无聊的@property
@property装饰器其实有点无聊,单独拿出来作为一个知识点其实没必要,尽管它可以将方法变成属性,让get和set方法更好用,但是,它破坏了python的简洁(不是代码的简洁而是指语法上). 下面来 ...
- 定时取数据库的schema,并推送到git服务器
写了个脚本,定时去数据库取schema,并推送到公司的git里. #daily_schema.py #/usr/bin/env python import os import datetime,tim ...
- Structs2配置文件相关说明
1,structs.xml文件解析 <package name="front" namespace="/front" extends="stru ...