在经历了Jsp实训的惨痛教训后，特意花了点时间学习Ajax，学完后自我感觉良好，于是写了如下一个小框架：
1 /** 2 * frameAjax 3 * 4 * 参数： 5 * paramsObj： Json 6 * required params: 7 * type：请求参数类型(String) 8 * url：请求地址(String) 9 * data：请求参数(Json)，data可为空值。10 * success：请求回调(Function)11 * async：表示请求是否异步处理。默认为true，表示异步，可省略不写。12 * 13 */14 15 (function () {16 function frameAjax(paramsObj) {17 //处理请求参数18 var arr = [];19 for (var pro in paramsObj.data) {20 arr.push(pro + ‘=‘ + paramsObj.data[pro]);21 }22 var data = arr.join("&"); //用“&”拼接请求参数23 var async = true; //默认异步24 if (paramsObj.async) { //判断是否异步处理25 async = paramsObj.async;26 }27 28 //创建Ajax引擎对象29 var ajax = getAjax();30 //复写onreadystatement函数31 ajax.onreadystatechange = function () {32 //判断Ajax状态码33 if (ajax.readyState == 4) {34 //判断响应状态码35 if (ajax.status == 200) {36 if (paramsObj.success) {37 paramsObj.success(ajax);38 }39 } else if (ajax.status == 404) {40 console.error("请求资源不存在");41 } else if (ajax.status == 500) {42 console.error("服务器繁忙");43 }44 }45 }46 47 //发送请求48 if (paramsObj.type.toLowerCase() == "get") {49 ajax.open("get", paramsObj.url + (data == null ? "" : "?" + data), async);50 ajax.send(null);51 } else if (paramsObj.type.toLowerCase() == "post") {52 ajax.open("post", paramsObj.url, async);53 ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");54 ajax.send(data);55 } else {56 console.log("请求类型错误");57 }58 }59 60 //获取请求对象61 function getAjax() {62 var ajax;63 if (window.XMLHttpRequest) { //火狐64 ajax = new XMLHttpRequest();65 } else if (window.ActiveXObject) { //IE66 ajax = new ActiveXObject("Msxml2.XMLHTTP");67 }68 return ajax;69 }70 //将框架封装于window对象中71 window.frameAjax = frameAjax;72 }())
