调用ajax封装POST GET True False 四种状态

JR.ajax = function(obj){
    //初始化对象,没填某项时使用默认值代替
    obj = {  
            //请求方法,默认POST
            method: obj.method || "POST",  
            //请求的URL  
            url:obj.url || "",  
            //发送的请求数据参数  
            data: obj.data || "",
            //请求超时的时间,默认5秒
            timeout: obj.timeout || 5000,  
            //请求成功时执行的函数
            success: obj.success || function(){},  
            //请求失败时执行的函数  
            error: obj.error || function(){},  
            //请求完成(不管成功还是失败都会调用)时执行的函数  
            complete: obj.complete || function(){},  
            //同步还是异步,默认异步
            async : obj.async || true
        };  
    //创建XHR对象
    var xhr = (function(){
        if( typeof XMLHttpRequst !== 'undefined') {  
            return new XMLHttpRequest();  
        } else if( typeof ActiveXObject !== 'undefined') {//否则判断ActiveXObject
            if( typeof arguments.callee.activeXString != 'string') {
                var versions = ['MSXML2.XMLHTTP.6.0', 'MSXML2.XMLHTTP.3.0', 'MSXML2.XMLHTTP'];
                for(var i = 0, len = versions.length; i < len; i++) {
                    try {
                         new ActiveXObject(versions[i]);
                         arguments.callee.activeXString = versions[i];
                         break;
                    } catch(ex) {
                        //跳过
                    }
                }
            }
            return new ActiveXObject(arguments.callee.activeXString);
        } else{
            throw new Error('No XHR object available');
        }
    })();
    var requestDone = false,//标志请求是否完成
    //通过使用JS随机字符串解决IE浏览器第二次默认获取缓存的问题
    obj.url = obj.url + '?rand=' + Math.random();
   //将名值对转换成字符串
    obj.data = (function(data){
        var arr = [];
        for (var i in data) {
            //特殊字符传参产生的问题可以使用encodeURIComponent()进行编码处理
            arr.push(encodeURIComponent(i) + '=' + encodeURIComponent(data[i]));
        }
        return arr.join('&');
    })(obj.data);
    //若是GET请求,则将数据加到url后面
    if (obj.data !== '' && obj.method === 'get') {
        obj.url += obj.url.indexOf('?') == -1 ? '?' + obj.data : '&' + obj.data; 
    }
    //在使用XHR对象时,必须先调用open()方法,
    //它接受三个参数:请求类型(get、post)、请求的URL和表示是否异步。
    xhr.open(obj.method, obj.url, obj.async);
    //初始化一个5秒的回调函数,用于取消请求(如果尚未完成的话)  
    setTimeout(function(){  
        requestDone = true;  
    }, obj.timeout);


    if (obj.async === true) {  //true表示异步,false表示同步
        //使用异步调用的时候,需要触发readystatechange 事件
        //监听文档状态的更新  
        xhr.onreadystatechange = function () {
            if (xhr.readyState == 4 && !requestDone) {   //判断对象的状态是否交互完成
                callback();         //回调
            }
        };
    }
    if (obj.method === 'post') {
        //post方式需要自己设置http的请求头,来模仿表单提交。
        //放在open方法之后,send方法之前。
        xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
        xhr.send(obj.data);        //post方式将数据放在send()方法里
    } else {
        xhr.send(null);        //get方式则填null
    }
    if (obj.async === false) {  //同步
        callback();
    }
    function callback() {
        if (xhr.status == 200) {  //判断http的交互是否成功,200表示成功
            obj.success(xhr.responseText);            //成功
        } else {
            obj.error(xhr.status,xhr.statusText)    //失败
        }
        //调用完成回调函数  
        opt.complete();
        //避免内存泄漏,清理文档  
        xhr = null; 
    }


    return this;
};
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章