首页 > 代码库 > javascript 实现ajax封装

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 = value10  *            的形式加在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  *            urlStr54  * @param {}55  *            GET or POST方式56  * @param {}57  *            paramJsonObj58  * @param {}59  *            callbackFunc60  */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 }

 

javascript 实现ajax封装