AJAX - onreadystatechange 事件

AJAX - onreadystatechange 事件


1.当请求被发送到服务器时,我们需要执行一些基于响应的任务。
2.每当 readyState 改变时,就会触发 onreadystatechange 事件。
3.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 事件被触发 4 次(0 - 4), 分别是: 0-1、1-2、2-3、3-4,对应着 readyState 的每个变化。
使用回调函数
回调函数是一种以参数形式传递给另一个函数的函数。

如果您的网站上存在多个 AJAX 任务,那么您应该为创建 XMLHttpRequest 对象编写一个标准的函数,并为每个 AJAX 任务调用该函数。

该函数调用应该包含 URL 以及发生 onreadystatechange 事件时执行的任务(每次调用可能不尽相同):

实例
function myFunction()
{
    loadXMLDoc("/try/ajax/ajax_info.txt",function()
    {
        if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
            document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
        }
    });
}


AJAXonreadystatechange 中怎样自定义一个事件

08-29

我需要在使用AJAX读取了一个文件之后,用JS改变容器的高度。rn比如文件读入 ,由于读入的文件大小不一,可能改变容器 Target 的高度。rn我所有的网页元素都使用了绝对坐标,高度改变后,需要用JS得到容器新的高度,由此改变其他div的位置。rnrn我把AJAX处理的代码都封装在一个类里面,由this.定义公共的属性和方法。rn本来在 onreadystatechange 调用的函数中定义了一个外部能够访问的属性——this.TargetDIVHeight,但文件读入之后,目标容器的新高度并没有得到。rn经过多次测试,发现只在 onreadystatechange 调用的函数中才能得到新高度(条件是CSS并没有设定这个容器的height),新高度虽然代入了this.TargetDIVHeight,但是外部不能得到。rnrn于是想到,我的AJAX封装在一个类里面,能否在onreadystatechange 调用的函数中 readyState==4 && status == 200 之后定义一个事件。rn在外部捕捉这个事件,事件发生后,外部就应该能正确得到容器的新高度。rnrn网上找到这样的代码:rnclass1.prototype = rnrn show:function()rn rn //show函数的实现rn this.onShow(); //触发onShow事件rn ,rn onShow:function() //定义事件接口rnrn但我看不懂该怎样实现我的需求。rnrn那位高手帮帮忙,我该怎样自定义一个事件?在外部怎么使用?rn谢谢!rn

ajaxonreadystatechange问题

05-26

各位前辈,如下程序,function processRequest()函数里的xmlhttp代码都没被执行,我测试了xmlhttp.readyState==4和rnxmlhttp.status==200都为真,而且在函数体的第一行放入alert(“1”)测试都有5个1出来,表明状态确实改变了5次,可是只要函数里一放入xmlhttp属性代码就都没办法执行下去,后来我把alert(xmlhttp.responseText);直接放到xmlhttp.send(null);后面,我想要的数据就出来了,说明xmlhttp的属性都有取值的,可为什么就是在processRequest()里这些代码都得不到执行呢?请大家知道的帮忙解决下哦,郁闷死了。。。。rnrnfunction doAjax(url)rn var xmlhttp;rn rn tryrn rn xmlhttp = new ActiveXObject("Msxm12.XMLHTTP"); rn catch(e)rn rn try xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");rn catch(e) rn tryrn xmlhttp = new XMLHttpRequest();rn if(xmlhttp.overrideMimeType)rn xmlhttp.overrideMimeType("text/xml");rn rn catch(e)rn rn rn rn //alert("3");rn if(!xmlhttp)rn window.alert("不能创建XMLHttpRequest对象实例");rn return false;rn rn rn xmlhttp.onreadystatechange = processRequest;rn rn xmlhttp.open("get",url,true);rn xmlhttp.send(null);rn //alert(xmlhttp.responseText);rn rn rn function processRequest()rn rn if(xmlhttp.readyState==4)rn rn if(xmlhttp.status==200)rn rn alert(xmlhttp.responseText);rn elsern alert("请求处理返回的数据有异常");rn rn else alert("处理数据未返回");rn rn rn function dataCheck()rn var f=document.form1;rn var username=f.UserName.value;rn if(username=="")rn rn alert("用户名为空");rn f.UserName.focus();rn return false;rn elsern //alert("2");rn doAjax("check.jsp?username="+username);rn rn rn rn

没有更多推荐了,返回首页

私密
私密原因:
请选择设置私密原因
  • 广告
  • 抄袭
  • 版权
  • 政治
  • 色情
  • 无意义
  • 其他
其他原因:
120
出错啦
系统繁忙,请稍后再试