美文网首页
ajax异步回调

ajax异步回调

作者: 逆流成河wsy | 来源:发表于2017-11-13 13:46 被阅读16次
       function ajax(url, fnSucc, fnFail) {
            var oAjax = new XMLHttpRequest();
            oAjax.open('GET', url, true);
            oAjax.send();
            oAjax.onload = function () {
                if (oAjax.readyState == 4 && oAjax.status == 200) {
                    fnSucc(oAjax.responseText)
                } else {
                    fnFail(oAjax.status);
                }
            };
        }
        window.onload = function () {
            let oBtn = document.getElementById('btn1');

            oBtn.onclick = function () {
                ajax('a.txt', function (str) {
                    alert(str);
                }, function (str) {
                    alert(str);
                });
            };
        };

promise异步封装例子

    function ajax(url, fnSucc, fnFail) {
            var oAjax = new XMLHttpRequest();
            oAjax.open('GET', url, true);
            oAjax.send();
            oAjax.onload = function () {
                if (oAjax.readyState == 4 && oAjax.status == 200) {
                    fnSucc(oAjax.responseText)
                } else {
                    fnFail(oAjax.status);
                }
            };
        }
        window.onload = function () {
            let oBtn = document.getElementById('btn1');
            let oBox = document.getElementById('box1');

            oBtn.onclick = function () {
                let p1 = new Promise(function (resolve, reject) {
                    ajax('a.txt', function (str) {
                        resolve(str);
                    }, function (str) {
                        reject(str);
                    });
                });

                p1.then(function (str) {
                    oBox.innerHTML = str;
                }, function (str) {
                    oBox.innerHTML = str;
                });

            };
        };

相关文章

  • 异步相关

    一:同步异步XmlHttpRequest: Ajax原理: a->b->c地狱回调问题: Promise解决回调地...

  • ajax异步回调

    promise异步封装例子

  • 浅谈js中的回调地狱问题

    一、什么是回调地狱 说起回调地狱 首先想到的是异步在js中我们经常会大量使用异步回调,例如使用ajax请求 我们来...

  • jQuery粗略源码解析3 异步队列

    异步队列模块用于异步任务和回调函数的解耦,为ajax模块,队列模块提供基础功能。jQuery.ajax()负责创建...

  • AJax基础

    什么是Ajax Ajax是用JavaScript执行异步网络请求,请求是异步执行的,也就是说,要通过回调函数获得响...

  • promise原理及实现

    回调地域:上一个回调函数中继续做事情,而且继续回调(在真实项目的Ajax请求中经常出现回调地域),异步请求,不方便...

  • js异步:现在与将来

    最简单的异步方式:回调 最早听说异步是在发送ajax请求的时候,因为我们不希望因为发送ajax的进程阻挡了其他事件...

  • ES6 - Promise和Ajax (精华)

    导读: Promise实际是充当ajax获取后台数据后执行回调的异步执行顺序的一个媒介,客观来说就是避免ajax回...

  • Promise和async\await

    回调函数 用来处理异步问题,例如发送Ajax,setTimeout等 Promise 封装的例子 async\await

  • promise的使用

    1、promise是用来干什么的? 用来处理回调,避免回调地狱 用来更好地处理异步行为 坏的例子:AJAX多级嵌套...

网友评论

      本文标题:ajax异步回调

      本文链接:https://www.haomeiwen.com/subject/ktkzmxtx.html