在上面使用了afterBlur 方法做了一个处理，该方法是当编辑框失焦的是触发的，然后再去做数据同步．
看到标题时，有些同学可能会想：“我已经用xhr成功地发过很多个Ajax请求了，对它的基本操作已经算挺熟练了。”...从图中可以看到： IE8/IE9、Opera Mini 完全不支持xhr对象 IE10/IE11部分支持，不支持 xhr.responseType为json 部分浏览器不支持设置请求超时，即无法使用...原因1：W3C的 xhr 标准中做了限制，规定客户端无法获取 response 中的 Set-Cookie、Set-Cookie2这2个字段，无论是同域还是跨域请求； 原因2：W3C 的 cors...以下3种情况下值都为null：请求未完成、请求失败、请求成功但返回数据无法被正确解析时 如何追踪ajax请求的当前状态 在发一个ajax请求后，如果想追踪请求当前处于哪种状态，该怎么做呢？...注意：只有xhr处于OPENED状态，才能调用xhr.setRequestHeader()和xhr.send(),否则会报错 2 HEADERS_RECEIVED(已获取响应头) send()方法已经被调用
以下是我认为对Ajax较为准确的解释：（摘自what is Ajax） AJAX stands for Asynchronous JavaScript and XML....XMLHttpRequest Level 1主要存在以下缺点： 受同源策略的限制，不能发送跨域请求； 不能发送二进制文件（如图片、视频、音频等），只能发送纯文本数据； 在发送和获取数据的过程中，无法实时获取进度信息...从图中可以看到： IE8/IE9、Opera Mini 完全不支持xhr对象 IE10/IE11部分支持，不支持 xhr.responseType为json 部分浏览器不支持设置请求超时，即无法使用xhr.timeout...原因1：W3C的 xhr 标准中做了限制，规定客户端无法获取 response 中的 Set-Cookie、Set-Cookie2这2个字段，无论是同域还是跨域请求； 原因2：W3C 的 cors 标准对于跨域请求也做了限制...以下3种情况下值都为null：请求未完成、请求失败、请求成功但返回数据无法被正确解析时 如何追踪ajax请求的当前状态 在发一个ajax请求后，如果想追踪请求当前处于哪种状态，该怎么做呢？
大家好，又见面了，我是你们的朋友全栈君。 什么是Ajax以及ajax请求的步骤 1.Ajax是什么? Asynchronous JavaScript & XML。Ajax是web开发的一种技术。...`HTTP`请求状态变化的函数； (4)发送`HTTP`请求； (5)获取异步调用返回的数据； (6)使用JavaScript和DOM实现局部刷新。...4.readyState状态码 0：请求未初始化 1：服务器连接已建立 2：请求已接收 3：请求处理中 4：请求已完成，且响应已就绪 5.http状态码（status） 200：（成功） 403：...发送`HTTP`请求； (5)获取异步调用返回的数据； (6)使用JavaScript和DOM实现局部刷新。...请求已接收 3：请求处理中 4：请求已完成，且响应已就绪 http状态码（status）
一、前端进行网络请求的关注点 大多数情况下，在前端发起一个网络请求我们只需关注下面几点： 传入基本参数（ url，请求方式） 请求参数、请求参数类型 设置请求头 获取响应的方式 获取响应头、响应状态、响应结果...对象所处的状态， XMLHttpRequest对象总是位于下列状态中的一个： |值|状态|描述 |-|-|-| |0 | UNSENT |代理被创建，但尚未调用 open() 方法。...然后我发现这里polyfill的实现和MDN-使用Fetch以及很多资料是不一致的： mdn: 默认情况下，fetch 不会从服务端发送或接收任何 cookies 于是我分别实验了下使用 polyfill...这也说明了，在 fetch执行完毕后，不能直接在 response中获取到返回值而必须调用 text()、json()等函数才能获取到返回值。...，从 fetch()返回的 Promise 不会被标记为 reject， 即使该 HTTP 响应的状态码是 404 或 500。
对于Ajax，肯定很多小伙伴都听过甚至用过了，那么没听过的也不用着急，本文会对Ajax进行讲解，其次，一定还有一些人只用过JQuery封装好了的Ajax却对原生的Ajax并不了解，那么也不用着急，本文从最基本的...） 三、Ajax的使用 Ajax的基本流程：创建XHR对象 => 发送数据 => 接收数据 （1）状态码 既然Ajax涉及到前后端的数据交互，那么我们就先来简单的看一下几种类型的状态码，如下表： 状态码...服务端返回的XML DOM文档 status HTTP状态码 statusText HTTP状态码说明 readyState xhr对象的请求响应阶段 既然我们要获取服务端返回的数据，我们就要知道服务端是何时返回数据的...status 属性，看看状态码是否为 200，当上述都成立了，我们再去 responseText 属性 或 responseXML 属性中获取响应数据 xhr.onreadystatechange =...，所以我们可以借鉴它，甚至尽可能地去模仿它进行封装，在这之前，我们得先了解JQuery中Ajax的使用 （1）JQuery中的Ajax 这里我找来了几段使用JQuery发送Ajax请求的代码，如下所示：
通过 AJAX 可以在浏览器中向服务器发送异步请求 最大的优势：无刷新获取数据。...XML 被设计用来传输和存储数据 XML 和 HTML 类似，不同的是 HTML 中都是预定义标签，而 XML 中没有预定义标签， 全都是自定义标签，用来表示一些数据 例如: 比如说我有一个学生数据：...服务器内部错误，无法完成请求 // 判断(服务端返回了所有的结果) if (xhr.readyState === 4) { //判断响应码 200 404 403...console.log(xhr.statusText);//状态字符串 // console.log( xhr.getAllResponseHeaders);//所有响应头 2.7...ajax 请求 浏览器端接收到响应 (1) 一般请求: 浏览器一般会直接显示响应体数据, 也就是我们常说的刷新/跳转页面 (2) ajax请求: 浏览器不会对界面进行任何更新操作, 只是调用监视的回调函数并传入响应相关数据
在这个状态下，我们可以通过then()方法设置的回调函数来获取这个值;已拒绝（rejected）：如果异步操作失败，或者在执行过程中抛出了一个错误，Promise对象就会变为拒绝状态 在这个状态下...：把回调函数嵌套代码，改成Promise链式调用结构* 需求：获取默认第一个省，第一个市，第一个地区并展示在下拉菜单中*/let province = ''// 1....Axios 3分钟让你学会axios在vue项目中的基本用法、Axios使用方法详解，从入门到进阶 当作进阶观看： ajax与XHR的理解和使用原生ajax、jquery-ajax、axios与fetch...的区别|优缺点草稿区：黑马程序员前端AJAX入门到实战 ✅黑马的官方的文档确实细致，细致到都不用我在补充都能看懂了，是不是我的技术提升的原因呢？...-Ajax详解_ajax解析 不懂哪里来的这么多观看Axios3分钟让你学会axios在vue项目中的基本用法Axios使用方法详解，从入门到进阶 当作进阶观看：ajax与XHR的理解和使用原生ajax
[AJAX 工作原理] AJAX 的创建步骤 根据 AJAX 的工作原理，它的创建步骤主要包括： 创建 XMLHttpRequest 对象，即创建一个异步调用对象。...设置响应 HTTP 请求状态变化的函数。 发送 HTTP 请求。 获取异步调用返回的数据。 使用 JavaScript 和 DOM 实现局部刷新。...然而，发送 HTTP 请求的目的是为了接收从服务器中返回的数据。...此时接收完毕后的数据存入在客户端计算机的内存中，可以使用 responseText 属性或 responseXml 属性来获取数据。...，才可以获取从服务器端返回的数据。
效果 readyState 0 xhr被创建，未调用open()方法 1 open()方法被调用，建立了连接 2 send()方法被调用，可以获取状态行和响应头 3 响应体下载中，responseTest...= function() { if(this.readyState === 4) { // 获取响应状态码 console.log(this.status); // 获取响应状态描述...() 创建一个对象 jQuery.get() 使用一个http get请求从服务器加载数据 jQuery.getJSON（） jQuery.getScript() GET请求从服务器加载并执行一个 JavaScript...文件 jQuery.post() 请求从服务器加载数据 跨域： 同源，域名，协议，端口，完全相同，同源的相互通过ajax的方式进行请求。...作者简介 达叔，理工男，简书作者&全栈工程师，感性理性兼备的写作者，个人独立开发者，我相信你也可以！阅读他的文章，会上瘾！，帮你成为更好的自己。长按下方二维码可关注，欢迎分享，置顶尤佳。
在进行Ajax开发时，经常使用GET方式或POST方式发送请求。 GET方式适合从服务器获取数据。 POST方式适合向服务器发送数据。需要设置内容的编码格式，告知服务器用什么样的格式来解析数据。...3.4 处理服务器返回的信息 获取Ajax的当前状态：readyState属性 readyState属性用于获取Ajax的当前状态，状态值有5种形式。...从网络安全角度来看，域是安全的边界，每个域都有自己的安全策略，不同域之间是隔离的，除非建立信任关系，否则无法互相访问。...当需要发送多个JSONP请求时，无法区分每个回调函数。 为了解决这两个问题，我们可以编写代码实现自动生成一个随机的回调函数名，并在请求时将函数名传递给服务器，服务器在返回结果中调用指定的函数。...6.2 FormData Ajax向服务器发送数据时，如何收集表单中的数据？ 以前的方法：通过DOM操作手动获取用户在表单中填写的值。
无法用 URL 直接访问 ajax 应用场景 场景 1. 数据验证 场景 2. 按需取数据 场景 3....1：请求已经建立，但是还没有发送（还没有调用 send() ）。 2：请求已发送，正在处理中（通常现在可以从响应中获取内容头）。...，因此其他人可以从浏览器的历史纪录中读取这些数据，如：账号、密码。...在 PHP 中，GET 方式用$_GET[]获取；POST 方式用$_POST[]获取;两种方式都可用$_REQUEST[]来获取 总结 使用load() 、$.get()和$.post()方法完成了一些常规的...)描述状态的字符串function(data,textStatus){//data 可能是 xmlDoc、“jsonObj、html、text 等this;//调用本次 Ajax 请求时传递的 options
这个属性有五个值： 值 状态 说明 0 未初始化 尚未调用open()方法 1 启动 已经调用open()方法，但尚未调用send()方法 2 发送 已经调用send()方法，但尚未接受响应 3 接受...状态代码：' + xhr.status + '状态信息：' + xhr.statusText); } } }; xhr.open('get', 'demo.php?...一．GET与POST 在提供服务器请求的过程中，有两种方式，分别是：GET和POST。在Ajax使用的过程中，GET的使用频率要比POST高。...'MyHeader', 'Lee'); //放在open方法之后，send方法之前 PS：我们只可以获取服务器返回回来响应头信息，无法获取向服务器提交的请求头信息，自然自定义的请求头，在JavaScript...端是无法获取到的。
Promise/Deferred模式直接促使JQuery 1.5版本的ajax重写，使得ajax调用中即使不调用success()、error()等方法，ajax也能执行，这样的调用方式比预先传入回调用起来更舒服...从语法上说，Promise就是一个可以从它内部获取异步操作结果的对象。Promise提供统一的API，以确保各种异步操作都可以用同样的方法进行处理。 Promise对象的特点： 对象状态不受外部影响。...只有异步操作的结果才可以决定当前是哪一种状态，任何其他操作都无法改变这个状态。 一旦状态改变，就不会再变，任何时候都可以得到这个结果。...本行代码处于同步执行流中。 // 同步执行流2 // 我是被成功异步读取的txt文本数据 Promise构造函数接收一个函数作为参数，这个函数又有两个参数，分别是resolve和reject。...，将Promise对象的状态从“未完成”变为“失败”（即从 pending 变为 rejected），在异步操作失败时调用，并将异步操作报出的错误，作为参数传递出去。
AJAX 一、AJAX简介 什么是 AJAX ？ AJAX = 异步 JavaScript 和 XML。 AJAX 是一种用于创建快速动态网页的技术。...然而，在以下情况中，请使用 POST 请求： 无法使用缓存文件（更新服务器上的文件或数据库） 向服务器发送大量数据（POST 没有数据量限制） 发送包含未知字符的用户输入时，POST 比 GET 更稳定也更可靠...第四步：注册监听器 在xmlHttp对象的一个事件上注册监听器：onreadystatechange xmlHttp对象一共有5个状态： 0状态：刚创建，还没有调用open()方法； 1...状态：请求开始，调用open()方法，但是没有调用send()方法； 2状态：调用完了send()方法； 3状态：服务器已经开始响应，但是响应未结束； 4状态：服务器响应结束； 得到xmlHttp...= getXMLHttpRequest(); // 处理响应结果，创建回调函数，根据响应状态动态更新页面 xhr.onreadystatechange
下一步，必须调用遍历器对象的next方法，使得指针移向下一个状态。...从语法上说，Promise是一个对象，从它可以获取异步操作的消息。Promise提供统一的API，各种异步操作都可以用同样的方法进行处理。 Promise对象有以下两个特点。...（1）对象的状态不受外界影响。Promise对象代表一个异步操作，有三种状态：Pending（进行中）、Resolved（已完成，又称Fulfilled）和Rejected（已失败）。...只有异步操作的结果，可以决定当前是哪一种状态，任何其他操作都无法改变这个状态。这也是Promise这个名字的由来，它的英语意思就是“承诺”，表示其他手段无法改变。...（2）一旦状态改变，就不会再变，任何时候都可以得到这个结果。Promise对象的状态改变，只有两种可能：从Pending变为Resolved和从Pending变为Rejected。
Ajax是一种异步进程，程序不会等待异步代码执行完后再继续执行后续代码 当后续代码需要调用Ajax返回的数据时，可能会有数据未返回的问题 Ajax的实现步骤 创建Ajax对象 var xhr =...(); Ajax状态值 在Ajax请求执行的过程中每一步都对应一个状态码 数值 意义 0 请求没有初始化，没有调用 open() 1 请求已经建立，但是没有发送 send() 2 请求已经发送 3 请求正在处理...，通常响应中已经有部分数据可以使用了 4 响应已经完成，可以获取并使用服务器响应了 xhr.readyState;//获取Ajax状态值 onreadstatechange事件 Ajax状态码发生变化的时候触发...// 当Ajax状态码发生变化时触发事件 xhr.onreadystatechange = function () { // 判断当Ajax状态码为4时 if (xhr.readyState...请求可能出错，妨碍服务器的处理 5xx 服务端错误，服务器不能正确执行一个正确的请求 低版本浏览器缓存问题 由于缓存的存在，在请求地址不发生改变的情况下，只有第一次的数据请求会发送到服务器端，后续的请求都会从浏览器的缓存中获取
大家好，又见面了，我是你们的朋友全栈君。 JS原生Ajax Ajax=异步Javascript+XML； ajax是一种数据请求的方式，不需要刷新整个页面。... //调用ajax函数 ajax({ url:'....状态码； statusText:HTTP状态的说明； XHR对象的readyState属性表示请求/响应过程的当前活动阶段，这个属性的值如下 0-未初始化，尚未调用open()方法； 1-启动，调用了...在readystatechange事件中，先判断响应是否接收完成，然后判断服务器是否成功处理请求，xhr.status 是状态码，状态码以2开头的都是成功，304表示从缓存中获取，上面的代码在每次请求的时候都加入了随机数...，所以不会从缓存中取值，故该状态不需判断。
云服务器
ICP备案
云直播
对象存储
即时通信 IM
