zoukankan      html  css  js  c++  java
  • 一个简单的ajax对象

    function ajax(options) {
        //请求参数
        options = {
            //类型
            type: options.type || "Post",
            //地址
            url: options.url || "",
            //超时时间
            timeout: options.timeout || 5000,
            //完成函数
            onComplete: options.onComplete || function () { },
            //错误函数
            onError: options.onError || function () { },
            //执行成功
            onSuccess: options.onSuccess || function () { },
            //传递数据
            data: options.data || "",
            //返回的数据类型
            datatype: options.datatype || "string",
        };
        //创建请求对象
        var xml = new XMLHttpRequest();
        //初始化异步请求
        xml.open(options.type, options.url, true);
        //请求超时时间
        var timeoutLength = options.timeout;
        //请求是否成功
        var requestDone = false;
        //初始化一个超时执行回调函数,用于取消请求
        setTimeout(function () {
            requestDone = true;
        }, timeoutLength);
    
        //监听文档状态的更新
        xml.onreadystatechange = function () {
            //保持等待,直到数据完全加载,并保证请求并未超时
            if (xml.readyState == 4 && !requestDone) {
                //检查请求是否成功
                if (httpSuccess(xml)) {
                    //以服务器返回的数据作为参数调用成功回调函数
                    options.onSuccess(httpData(xml, options.datatype));
                } else {
                    //发生错误时执行错误回调函数
                    options.onError();
                }
                //执行完成回调函数
                options.onComplete();
                //清理文档,避免内存泄露
                xml = null;
            }
        };
        //建立与服务器的连接
        xml.send();
    
        //判断http是否响应成功
        function httpSuccess(r) {
            try {
                //如果得不到服务器状态且我们正在请求本地文件,认为成功
                return !r.status && location.protocol == "file:" ||
                    //所有的200~300状态码表示成功
                    (r.status >= 200 && r.status < 300) ||
                    //文档未修改也表示成功
                    r.status == 304 ||
                    //Safari在文档未修改时返回空状态
                    navigator.userAgent.indexOf("Safari") >= 0
                        && typeof r.status == "undefined";
            } catch (e) {
                //若检查状态失败,则假定请求是失败的
                return false
            }
        }
    
        //从http响应中解析正确的数据
        function httpData(r, type) {
            //获取content-type的首部
            var ct = r.getResponseHeader("content-type");
            //若没有提供类型,判断服务器返回的是否是xml形式
            var data = !type && ct && ct.indexOf("xml") >= 0;
            //若是,获得xml文档对象,否则返回文本内容
            data = type == "xml" || data ? r.responseXml : r.responseText;
            //若指定类型是 script ,则以Javascript形式返回文本
            if (type == "script") {
                eval.call(window, data);
            } else if (type == "json") {
                data = eval(data);
            }
            //返回响应数据
            return data;
        }
    }
    

      使用

    ajax({
                url: "/Home/GetTestData",
                type: "get",
                datatype: "json",
                onSuccess: function (result) {
                     alert(result);
                },
                onError: function (xhr) {
                    var x = xhr;
                }
            });
    

      

  • 相关阅读:
    Drawable和Bitmap的区别
    Android中的Drawable资源
    了解Objective-C中NSAutoreleasePool使用方法
    Object-C 内存管理及对象
    事件类型: 错误 事件来源: Service Control Manager 事件种类: 无 事件 ID: 7000
    HTML xmlns
    asp.net(C#)清除全部Session与单个Session
    Html学习笔记---html5表单元素
    jquery学习笔记---jquery事件($.event.special )
    C#学习笔记---Dispose(),Finalize(),SuppressFinalize
  • 原文地址:https://www.cnblogs.com/lc-ant/p/4981285.html
Copyright © 2011-2022 走看看