封装的ajax工具函数

/**
 * Created by liyinghao on 2016/9/22.
 */
/*封装ajax工具函数*/

/*请求方式get post   数据格式xml json*/
/*考虑确定有哪些不确定的参数
 * 1.请求方式  type   get post   没有传递参数的时候 get方式
 * 2.接口地址  url   地址如果没有传递,默认是当前的地址
 * 3.是否异步   async  true  false  默认是true异步
 * 4.请求数据不确定  data  {}对象的形式  默认为空
 * 5.请求成功之后做的事情  success 回调函数  callback
 * 6. 请求失败回调函数     error
 * 7.请求发送前要做的事情  beforeSend
 * */
window.$ = {
    // ajax:function(){}
};

/*定义一个ajax工具函数*/
/*options是一个对象var options = {}*/
$.ajax = function (options) {
    /*如果没有传递参数,就停止执行*/
    if (!options || typeof options != 'object') return false;
    /*如果传递了参数*/
    var type = options.type || 'get';//如果有就用用户传递的
    // var url=options.url||window.location.href;//如果没有传递地址就使用当前路径(是一个绝对路径)
    var url = options.url || location.pathname;//如果没有传递地址就使用当前的路径(是一个相对路径)
    var async = options.async === false ? false : true;//只有传递进来的参数确实是false才是false
    var data = options.data || {};//向后台传递的参数 不能直接传递对象,需要转化为
    /*需要把data数据转化为ajax传递数据的格式 name=xx&age=18 */
    var dataStr='';
    for (key in data) {
        dataStr +=key + '=' + data[key] + '&';
    }
    dataStr = dataStr || dataStr.slice(0, -1);//把dataStr最后一个&去掉


    /*ajax变成*/
    /*初始化*/
    var xhr = new XMLHttpRequest();
    /*如果是get请求,采纳数应该拼接在url后面*/

    xhr.open(type, type == 'get' ? url+'?' + dataStr : url, async);

    /*设置请求头*/
    if (type == 'post') {
        xhr.setRequestHeader('Content-Type', 'application/x-www-urlencoded');
    }

    /*设置请求内容*/

    xhr.send(type = 'get' ? null : dataStr);

    /*相应部分*/
    console.log(111);
    xhr.onreadystatechange = function () {

        if (xhr.readyState == 4) {  /*首先确定通讯完全完成*/
            if (xhr.status == 200) { /*只有这种情况才是通讯成功*/

                /*成功*/
                /*确定后台想要返回什么数据类型*/
                /*application/xml  appliaction/json  text/xml text/json text/css*/
                var contentType = xhr.getResponseHeader('content-Type')
                var result = null;//接收返回的值
                if (contentType.indexOf('xml') > -1) {//说明返回的contentType包含xml后台返回的数据类型为xml
                    result = xhr.responseXML;

                } else if (contentType.indexOf('json') > -1) {
                    result = xhr.responseText;
                    result = result && JSON.parse(result);//转化为js对象
                    console.log(result );
                } else {
                    result = xhr.responseText;
                    /*当做字符串不做任何处理*/
                }
                /*执行成功回调函数*/
                options.success && options.success(result);

            } else {
                /*失败*/
                /*失败的时候提示信息*/
                options.error && options.error({
                    status: xhr.status,
                    statusText: xhr.statusText
                });
            }

        }
    };

};

/*get*/
$.get = function (options) {
    options.type = 'get';
    $.ajax(options);
};

/*post*/
$.post = function (options) {
    options.type = 'post';
    $.ajax(options);
};

转载于:https://my.oschina.net/itly/blog/752013