javascript 实现ajax封装

1 纯javascript 封装发送ajax数据

2 post、get方式 发送数据

 1 GLOBAL.namespace("Ajax");
 2 /**
 3  * 同步ajax 返回json Object
 4  *
 5  * @param {}
 6  *            urlStr
 7  * @param{} type GET or POST方式
 8  * @param {}
 9  *            paramsStr 与服务器约定 如果为GEt方式 则必须为 key1 = value & key2 = value
10  *            的形式加在url后
11  * @return {} 返回字符串
12  */
13 GLOBAL.Ajax.ajaxSyncCall = function(urlStr, type, paramsStr) {
14     var obj;
15     var value;
16     if (window.ActiveXObject) {
17         obj = new ActiveXObject(‘Microsoft.XMLHTTP‘);
18     } else if (window.XMLHttpRequest) {
19         obj = new XMLHttpRequest();
20     }
21     if (type == "POST") {
22         obj.open(‘POST‘, urlStr, false);
23         obj.setRequestHeader(‘Content-Type‘,
24                 ‘application/x-www-form-urlencoded‘);
25         obj.send(paramsStr);
26     } else if(type == "GET")
27     {
28         obj.open(‘GET‘, urlStr, false);
29         obj.send(null);
30     }
31     var result = null;
32     if (obj.readyState == 4) {
33         if (obj.status == 200) {
34             result = obj.responseText;
35         }
36     }
37     return result;
38 }
39 /* 用于ajax异步传输方法 */
40 GLOBAL.Ajax.ajaxAsynCallBack = function(xhr, callback) {
41     var result = null;
42     if (obj.readyState == 4) {
43         if (obj.status == 200) {
44             result = obj.responseText;
45             callback(result);
46         }
47     }
48 }
49 /**
50  * ajax异步提交方式
51  *
52  * @param {}
53  *            urlStr
54  * @param {}
55  *            GET or POST方式
56  * @param {}
57  *            paramJsonObj
58  * @param {}
59  *            callbackFunc
60  */
61 GLOBAL.Ajax.ajaxAsynCall = function(urlStr, type, paramsStr, callback) {
62     var obj;
63     var value;
64     if (window.ActiveXObject) {
65         obj = new ActiveXObject(‘Microsoft.XMLHTTP‘);
66     } else if (window.XMLHttpRequest) {
67         obj = new XMLHttpRequest();
68     }
69     obj.onreadystatechange = GLOBAL.Ajax.ajaxAsynCallBack(obj, callback);
70     if (type == "POST") {
71         obj.open(‘POST‘, urlStr, true);
72         obj.setRequestHeader(‘Content-Type‘,
73                 ‘application/x-www-form-urlencoded‘);
74         obj.send(paramsStr);
75     } else if(type == "GET")
76     {
77         obj.open(‘GET‘, urlStr, true);
78         obj.send(null);
79     }
80 }

需要用到的参数方法，在基础类中：

1 创建post字符串

2 创建get字符串

 1 /*
 2  * @parameters 为一个对象
 3  * 返回一个带值的url字符串
 4 */
 5 GLOBAL.TOOL.creatGETParam=function(url,parameters)
 6 {
 7    var rtnStr= null;
 8    var tmpStr=‘‘,str;
 9    var i = 0;
10    rtnStr = url+"?";
11    for (var key in parameters) {
12         str = escape(key) +"="+escape(parameters[key]);
13         if(i==0)
14         {
15             tmpStr+=str;
16             i++;
17         }
18         else{
19             tmpStr+=‘&‘+str;
20         }
21    }
22    rtnStr+=tmpStr;
23    return rtnStr;
24 }
25
26 GLOBAL.TOOL.cratePOSTParam=function(parameters)
27 {
28     var rtnStr =‘‘;
29     var i = 0;
30     var tmpStr=‘‘,str;
31     for(var key in parameters)
32     {
33         str = escape(key) +"="+escape(parameters[key]);
34         if(i==0)
35             {
36              tmpStr+=str;
37              i++;
38             }
39         else
40             {
41              tmpStr+=‘&‘+str;
42             }
43     }
44     return tmpStr;
45 }