Ajax中onreadystatechange函数放在open()后不执行这件事

今天动手写Ajax时遇到的问题:按照下面的顺序来写Ajax,功能是alert出txt文档的内容,在Chrome下可以执行onreadystatechange中的事件,在IE11及以下、FF就不能执行onreadystatechange中的代码。

ajax:
1.创建Ajax对象  ——new XMLHttpRequest;/ new ActiveXObject('Microsoft.XMLHTTP');
2.连接到服务器 ——open
3.发送请求 ——send
4.接收返回值 ——onreadystatechange

解决:将onreadystatechange代码块放到open之前,即可在Chrome、IE11及以下、FF完成功能。

为了弄清楚原因以及查看这样对Ajax的影响,添加了一些alert readyState,js代码如下,html中就是写一个"id=btn1"的按钮,open中的文件自行替换:

可以发现onreadystatechange在Chrome和FF中是当状态更改时才执行,在IE11不同版本以后则是顺序有些不同,感兴趣的小伙伴可以跟着查看一下,将onreadystatechange提到open前之后,就全靠函数内的if判断状态来控制http状态码不同情况要做的事情了;

以上提及的浏览器最后都能完成功能解析txt并弹出,而一般开发过程中是关注状态ready State=4的情况就可以,所以可以忽略这些差异。(另外问了其他开发,这样会不会造成资源浪费,大概意思是一般只关注4的,readyState从0到4有限可以忽略)

window.onload = function(){
	var oBtn = document.getElementById('btn1');
	
	oBtn.onclick = function(){
		if(window.XMLHttpRequest){
			var oAjax = new XMLHttpRequest();
		}
		else{
			var oAjax = new ActiveXObject('Microsoft.XMLHTTP');
		};
		alert('创建对象后:'+oAjax.readyState);
		
		oAjax.onreadystatechange = function(){
			alert('enter onreadystatechange'+oAjax.readyState);
			if(oAjax.readyState==4){
				if(oAjax.status==200){
					alert(oAjax.responseText);
				}
				else{
					alert('status!=200:'+oAjax.readyState);
				};
			};
		};
		
		oAjax.open('GET', 'readmee.txt', true);
		alert('连接服务器后:'+oAjax.readyState);
		
		oAjax.send();
		alert('发送请求后'+oAjax.readyState);
	};
}

查看《JavaScript高级程序设计(第3版)》中关于onreadystatechange相关的内容,但没找到出问题的原因。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值