原生js实现Ajax

发表于 | 更新于: | 分类于 | 阅读次数:
字数统计: 248

原生js实现Ajax

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
function ajax(){
var ajaxData = {
    type:arguments[0].type || 'GET',
    url：arguments[0].url || '',
    aysnc:arguments[0].async || 'true',
    data:arguments[0].data || null,
    dataType:arguments[0].dataType || 'text',
    contentType:arguments[0].contentType || 'application/x-www-form-urlencoded',
    beforeSend:arguments[0].beforeSend || function(){},
    success:arguments[0].success || function(){},
    error:arguments[0].error || function(){},
}
ajaxData.beforeSend(){
    var xhr = createxmlHttpRequest();
    xhr.responseType = ajaxData.dataType;
    xhr.open(ajaxData.type,ajaxData.url,ajaxData.async);
    xhr.setRequestHeader("Content-Type",ajaxData.contentType);  
    xhr.send(convertData(ajaxData.data));  
    xhr.onreadystatechange = function() {  
        if (xhr.readyState == 4) {  
            if(xhr.status == 200){ 
                ajaxData.success(xhr.response) 
            }else{ 
                ajaxData.error() 
            }  
        } 
    }
}
function createxmlHttpRequest() {  
    if (window.ActiveXObject) {  
        return new ActiveXObject("Microsoft.XMLHTTP");  
    } else if (window.XMLHttpRequest) {  
        return new XMLHttpRequest();  
    }  
} 
function convertData(data){ 
    if( typeof data === 'object' ){ 
        var convertResult = "" ;  
        for(var c in data){  
            convertResult+= c + "=" + data[c] + "&";  
        }  
        convertResult=convertResult.substring(0,convertResult.length-1) 
        return convertResult; 
    }else{ 
        return data; 
    } 
}
}

// 调用
ajax({ 
    type:"POST", 
    url:"ajax.php", 
    dataType:"json", 
    data:{"val1":"abc","val2":123,"val3":"456"}, 
    beforeSend:function(){ 
    //some js code 
    }, 
    success:function(msg){ 
    console.log(msg) 
    }, 
    error:function(){ 
    console.log("error") 
    } 
})
0%