关于Ajax使用 Callback 函数
1、onreadystatechange 事件
当请求被发送到服务器时，我们需要执行一些基于响应的任务。
每当 readyState 改变时，就会触发 onreadystatechange 事件。
readyState 属性存有 XMLHttpRequest 的状态信息。
| 属性 | 描述 |
|---|---|
| onreadystatechange | 存储函数（或函数名），每当 readyState 属性改变时，就会调用该函数。 |
| readyState |
存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。
|
| status |
200: "OK" 404: 未找到页面 |
在 onreadystatechange 事件中，我们规定当服务器响应已做好被处理的准备时所执行的任务。
当 readyState 等于 4 且状态为 200 时，表示响应已就绪：
<html>
<head>
<script type="text/javascript">
function loadXMLDoc()
{
var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","/ajax/test1.txt",true);
xmlhttp.send();
}
</script>
</head>
<body> <div id="myDiv"><h2>Let AJAX change this text</h2></div>
<button type="button" onclick="loadXMLDoc()">通过 AJAX 改变内容</button> </body>
</html>
注释：onreadystatechange 事件被触发 5 次（0 - 4），对应着 readyState 的每个变化。
2、使用 Callback 函数
callback 函数是一种以参数形式传递给另一个函数的函数。
如果您的网站上存在多个 AJAX 任务，那么您应该为创建 XMLHttpRequest 对象编写一个标准的函数，并为每个 AJAX 任务调用该函数。
该函数调用应该包含 URL 以及发生 onreadystatechange 事件时执行的任务（每次调用可能不尽相同）：
<html>
<head>
<script type="text/javascript">
var xmlhttp;
function loadXMLDoc(url,cfunc)
{
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=cfunc;
xmlhttp.open("GET",url,true);
xmlhttp.send();
}
function myFunction()
{
loadXMLDoc("/ajax/test1.txt",function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
});
}
</script>
</head>
<body> <div id="myDiv"><h2>Let AJAX change this text</h2></div>
<button type="button" onclick="myFunction()">通过 AJAX 改变内容</button> </body>
</html>
关于Ajax使用 Callback 函数的更多相关文章
- jQuery ajax() 参数,回调函数，数据类型，发送数据到服务器，高级选项
$.ajax({ options:/*类型:Object; 可选.AJAX 请求设置.所有选项都是可选的.*/ async:/*类型:Boolean; 默认值: true.默认设置下,所有请求均为异 ...
- ajax的回调函数和匿名函数
1.什么是js回调函数 一. 回调函数的作用 js代码会至上而下一条线执行下去,但是有时候我们需要等到一个操作结束之后再进行下一个操作,这时候就需要用到回调函数. 二. 回调函数的解释 因为函数实际上 ...
- js进阶 14 jquery的ajax有哪些函数和事件（多练）
js进阶 14 jquery的ajax有哪些函数和事件(多练) 一.总结 一句话总结:常用:load.ajax.post.get.getScript().getJSON().表单序列化,ajax事件这 ...
- javascript callback函数的理解与使用
最近做的一个项目中用到了callback函数,于是就研究了下总结下我对javascript callback的理解 首先从callback的字面翻译“回调” 可以理解这是一个函数被调用的机制 当我们遇 ...
- jQuery 停止动画、jQuery Callback 函数、jQuery - Chaining
一.jQuery 停止动画 jQuery stop() 方法用于在动画或效果完成前对它们进行停止. stop() 方法适用于所有 jQuery 效果函数,包括滑动.淡入淡出和自定义动画. $(sele ...
- jQuery Callback 函数
@(编程) Callback 函数在当前动画 100% 完成之后执行. jQuery 动画的问题 许多 jQuery 函数涉及动画.这些函数也许会将 speed 或 duration 作为可选参数. ...
- 什么叫CallBack函数，怎么用回调函数？
JQuery众多常用方法中很经常会用到回调函数, 理解好js callback函数定义及用法,我们就可以利用callback函数帮我们做很多事情啦! A callback is a function ...
- c++将lambda作为callback函数
想用c++发送http_post请求,用到了libcurl. 想将其包装一下,因为默认http的响应结果是打印到stdout的,如果想将响应结果另外处理,需要自己定义一个callback函数. 考虑到 ...
- jQuery Callback函数的用法
在动画100%完成后,调用callback函数 语法如下 $(selector).hide(speed, callback); <!-- html部分 --> <button> ...
随机推荐
- LeetCode: Combination Sum I && II && III
Title: https://leetcode.com/problems/combination-sum/ Given a set of candidate numbers (C) and a tar ...
- win32 摄像头捕获系统vfw
//win32 摄像头捕获系统vfw // VideoRecord.h /// 用于定义一些资源ID #include "resource.h" //#define EXIT ...
- Oracle的OracleBulkCopy不支持事务处理
在进行OracleBulkCopy批量数据导入的过程中使用事务后抛出了异常, 没使用事务时可以正确批量导入, ORA-12154:无法解析指定的连接字符串, 但是TNS配置肯定是没有错的, 难道是Co ...
- dell optiplex台式机 安装win7 清楚分区的方法
http://jingyan.baidu.com/article/92255446e1065f851648f42b.html
- poj 1505 Copying Books
http://poj.org/problem?id=1505 Copying Books Time Limit: 3000MS Memory Limit: 10000K Total Submiss ...
- Linux基本命令（3）文件备份和压缩命令
文件备份和压缩命令 在Linux中,常用的文件压缩工具有gzip.bzip2.zip.bzip2是最理想的压缩工具,它提供了最大限度的压缩.zip兼容性好,Windows也支持. 命令 功能 bzip ...
- linux下配置双网卡及RAC规划——1
使用背景: 操作系统:centos 虚拟机:virtualbox RAC系统中需要双网卡,一个为公共的网络环境,一个为私有的网络环境,从而需要搭建双网络. 在菜单FILE中选择preferences, ...
- [微软实习生2014]K-th string
很久之前的事情了,微软2014实习生的在线测试题,记录下来以备后用. 题目描述: Description Consider a string set that each of them consist ...
- Redis3.0 Install
Installation Download, extract and compile Redis with: $ wget http://download.redis.io/releases/redi ...
- Downloading the Google Cloud Storage Client Library
Google Cloud Storage client是一个客户端库,与任何一个生产环境使用的App Engine版本都相互独立.如果你想使用App Engine Development server ...