Rumah > hujung hadapan web > tutorial js > JavaScript自己封装ajax的js

JavaScript自己封装ajax的js

高洛峰
Lepaskan: 2016-11-26 14:49:34
asal
1355 orang telah melayarinya

[javascript]
/**   
* 执行基本ajax请求,返回XMLHttpRequest   
*  Ajax.request({   
*  url
*  async 是否异步 true(默认)  
*  method 请求方式 POST or GET(默认)  
*  data 请求参数 (键值对字符串)  
*  success 请求成功后响应函数,参数为xhr  
*  error 请求失败后响应函数,参数为xhr  
*  });   
*/     www.2cto.com
Ajax = function() { 
    function request(opt) { 
        function fn() { 
        } 
        var url = opt.url || ""; 
        var async = opt.async !== false, method = opt.method || 'GET', data = opt.data 
                || null, success = opt.success || fn, error = opt.failure 
                || fn; 
        method = method.toUpperCase(); 
        if (method == 'GET' && data) { 
            var args = ""; 
            if(typeof data == 'string'){ 
                //alert("string") 
            args = data; 
            }else if(typeof data == 'object'){ 
                //alert("object") 
                var arr = new Array(); 
                for(var k in data){ 
                    var v = data[k]; 
                    arr.push(k + "=" + v); 
                } 
                args = arr.join("&"); 
            } 
        url += (url.indexOf('?') == -1 ? '?' : '&') + args; 
            data = null; 
        } 
        var xhr = window.XMLHttpRequest ? new XMLHttpRequest() 
                : new ActiveXObject('Microsoft.XMLHTTP'); 
        xhr.onreadystatechange = function() { 
            _onStateChange(xhr, success, error); 
        }; 
        xhr.open(method, url, async); 
        if (method == 'POST') { 
            xhr.setRequestHeader('Content-type', 
                    'application/x-www-form-urlencoded;'); 
        } 
        xhr.send(data); 
        return xhr; 
    } 
    function _onStateChange(xhr, success, failure) { 
        if (xhr.readyState == 4) { 
            var s = xhr.status; 
            if (s >= 200 && s < 300) { 
                success(xhr); 
            } else { 
                failure(xhr); 
            } 
        } else { 
        } 
    } 
    return { 
        request : request 
    }; 
}(); 
[javascript] 
 Ajax.request({ 
    url : path + "/report/topn/topn_data.jsp", 
    data : { 
        datatype : datatype 
    }, 
    success : function(xhr) { 
        onData(xhr.responseText); 
    }, 
    error : function(xhr) { 
         
    } 
});
Salin selepas log masuk


Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan