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相关的内容,但没找到出问题的原因。

原文链接:https://blog.csdn.net/LongtengGensSupreme/article/details/84062739
Ajax中onreadystatechange函数不执行,是因为放在open()后的更多相关文章
- AJAX中success函数的执行顺序
1,问题,在上图中,数据传输正常,但是一直输出为空的p,再输出66, 2,原因,默认开启了异步加载, 3,解决方法,开启同步,或者在success中添加函数.
- $.getJSON('url',function(data){}) 中回调函数不执行
$.getJSON('url',function(data){}) 中回调函数不执行 url 中的 json 格式不正确 ,浏览器返回并没有报错 {'湖北':[114.11438,30.849429] ...
- (转)在网页中JS函数自动执行常用三种方法
原文:http://blog.sina.com.cn/s/blog_6f6b4c3c0100nxx8.html 在网页中JS函数自动执行常用三种方法 在网页中JS函数自动执行常用三种方法 在HTML中 ...
- 在网页中JS函数自动执行常用三种方法
在网页中JS函数自动执行常用三种方法 在HTML中的Head区域中,有如下函数: <SCRIPT LANGUAGE="JavaScript"> function ...
- ajax中的post方法中回调函数不执行的问题
前一段时间接触了JQuery Ajax中的.post()方法和.get()方法,感觉到ajax的简洁和强大,当用到.post()方法时,去W3上查找相关的使用方法,感觉十分简单,用法很明了,然后,直接 ...
- Unity3D中默认函数的执行顺序
直接用一张图来说明各个默认函数的执行顺序: FixedUpdate以固定的物理时间间隔被调用,不受游戏帧率影响.一个游戏帧可能会调用多次FixedUpdate.比如处理Rigidbody的时候最好用F ...
- python中的函数的执行分类
author:headsen chen date: 2018-03-21 17:42:13 notice:This article created by headsen chen himself ...
- android view 中各函数的执行顺数
这个就好像是 activity 的生命周期一样,如果我们要使用自定义的 view,那么就很有必要了解一下 view 的那些能够被重写的函数的执行顺序.废话不多讲,以常用的5个函数为例子,见下文: pa ...
- Linux中Main函数的执行过程
1. 问题:Linux如何执行main函数. 本文使用一个简单的C程序(simple.c)作为例子讲解.代码如下, int main() { return(0); } 2. 编译 -#gcc -o ...
随机推荐
- [译]kendoui - 方法和事件
原文 为了使用方法和事件,首先要获取到widget实例. 获取widget 一共有3种获取widget的方式. jQuery的data方法 将widget的名作为参数传给jQuery的data方法.( ...
- ubuntu18.04下安装mysql后无法用mysqlworkbench访问
问题描述:我在ubuntu18.04下执行以下命令安装mysql时遇到了mysqlworkbench无法连接root用户的问题.ubuntu18.04下默认安装mysql时是5.7版本的,但是5.7版 ...
- kettle中的合并记录使用记录
注意:合并记录的使用前提是2个数据源都按比较关键字排过序,否则合并之后的数据不准确,可能会多出很多. 该步骤用于将两个不同来源的数据合并,这两个来源的数据分别为旧数据和新数据,该步骤将旧数据和新数据按 ...
- Chain训练准则的计算
轮迭代时验证集的日志: log/compute_prob_valid.1000.log: LOG (nnet3-chain-compute-prob[5.5.100-d66be]:PrintTotal ...
- 使用MiniProfiler检测页面性能
1.引入nuget包 PM> Install-Package MiniProfiler 2.配置界面 @using StackExchange.Profiling; <head> . ...
- C++ 类使用多线程技术
参考文章 : http://blog.csdn.net/jmh1996/article/details/72235232 成员函数作为线程函数, 要将成员函数定义为静态的 C++ 静态成员函数调用非 ...
- Python pipenv
pipenv都包含什么? pipenv 是 Pipfile 主要倡导者.requests 作者 Kenneth Reitz 写的一个命令行工具,主要包含了Pipfile.pip.click.reque ...
- 【CentOS】Tomcat的安装
文件上传方式(推荐) # 解压 tar zxvf apache-tomcat-9.0.1.tar.gz # 进入bin目录启动 ./startup.sh # 进入log目录查看日志信息 tail -f ...
- eureka ... is an unknown property 在 application.properties 中
问题如图 在application.properties中无法识别eureka 解决方式 (想了想这个好像是在某个依赖里面来的)发现 eureka 是在 某个依赖里面 所以添加了以下之后就解决了 ...
- 2、jQuery的基本概念-必看-版本-入口函数- jq对象和dom对象区别
1.4. jQuery的版本 官网下载地址:http://jquery.com/download/ jQuery版本有很多,分为1.x 2.x 3.x 大版本分类: 1.x版本:能够兼容IE678浏览 ...