继之前学习的认识Ajax相关基础内容,今天将做一些补充学习。
(一)onreadystatechange事件的补充
什么情况下会产生onreadystatechange事件呢?
1、每当readyState改变是,就会触发onreadystatechange事件。
2、而readyState存在于XMLHttpRequest对象中。
3、在 onreadystatechange 事件中,我们规定当服务器响应已做好被处理的准备时所执行的任务。
4、当 readyState 等于 4 且状态为 200 时,表示响应已就绪:
相关代码如下:
xmlhttp.onreadystatechange = function(){
if(xmlhttp.readystate ==4 && xmlhttp.status == 200){
document.getElementById(xxx).innerHTML =xmlhttp. responseText;
}
}
(二)Ajax中使用回调函数
为什么?
如果您的网站上存在多个 AJAX 任务,那么您应该为创建 XMLHttpRequest 对象编写一个标准的函数,并为每个 AJAX 任务调用该函数。该函数调用应该包含 URL 以及发生 onreadystatechange 事件时执行的任务(每次调用可能不尽相同):
使用回调函数的代码:
//例子
<!doctype html>
<html>
<head>
<meta charset = "utf-8">
<title>用回调函数写Ajax</title>
</head>
<body>
<div id="myText">使用Ajax被修改的内容</div>
<input type="button" onclick="myfunction()" value="点击修改">
<script type="text/javascript">
var xmlhttp;
、、该函数可以重复多用。把变化的东西用参数形式传进来
function loadinformation(url,func){
if(window.XMLHttpRequest){
xmlhttp =new XMLHttpRequest();
}else{
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange =func;
open("GET",a,true);
send();
}
}
function myfunction(){
//用户通过点击事件调用该函数,函数中的函数以参数形式传入。
loadinformation(xxxx,function(){
if(xmlhttp.readyState == 4 && xmlhttp.status == 200){
document.getElementById("myText").innerHTML = xmlhttp.responseText;
});
}
</script>
</body>
</html>
补充什么是回调函数:函数以一种参数的形式传递到另一函数。
网友评论