写了一个javascript程序,把ajax封装了在一个js文件中,供大家参考,请多多指教。
先声明几个变量:
var AJAXUtil = new Object();//工具对象 var xmlHttpRequest;//XMLHttpRequest对象 var sateChangeMethod; //方法变量
创建xmlHttpRequest对象:
AJAXUtil.createXMLHttpRequest = function(){ try { xmlHttpRequest = new XMLHttpRequest(); } catch (trymicrosoft) { try { xmlHttpRequest = new ActiveXObject("Msxml2.XMLHTTP"); } catch (othermicrosoft) { try { xmlHttpRequest = new ActiveXObject("Microsoft.XMLHTTP"); } catch (failed) { xmlHttpRequest = false; } } } }
执行Get/Post的请求中传入的方法:
/*执行Get/Post的请求中传入的方法*/ AJAXUtil.handleStateChange = function(){ if(xmlHttpRequest.readyState == 4){ if(xmlHttpRequest.status == 200){ //这里加上(),执行sateChangeMethod方法,这种方式叫做自调用 //参考,http://xiayuanfeng.iteye.com/blog/304565 sateChangeMethod(); } } }
Get请求方式:
/* Get请求方式stateChange传入的业务方法,url地址,isAsynch是否异步*/ AJAXUtil.doRequstUsingGet = function(stateChange,url,isAsynch){ sateChangeMethod = stateChange; AJAXUtil.createXMLHttpRequest(); xmlHttpRequest.onreadystatechange = AJAXUtil.handleStateChange; xmlHttpRequest.open("GET",url,isAsynch); xmlHttpRequest.send(null); }
Post请求方式:
/* Post请求方式stateChange传入的业务方法,url地址,isAsynch是否异步,queryString参数串*/ AJAXUtil.doRequstUsingPost = function(stateChange,url,isAsynch,queryString){ sateChangeMethod = stateChange; AJAXUtil.createXMLHttpRequest(); xmlHttpRequest.onreadystatechange = AJAXUtil.handleStateChange; xmlHttpRequest.open("POST",url,isAsynch); xmlHttpRequest.setRequestHeader("Content-Type","application/x-www-form-urlencoded;") xmlHttpRequest.send(queryString); }
测试代码:
String validateAction = contextPath + "/RF/ExchangePointValidate.html";
function $(id){ return document.getElementById(id); } function keyupCheck(obj){ obj.value = obj.value.replace(/[^\d.]/g,''); $("RFInput").value = obj.value*<%=rate%>; $("validateMessage").innerHTML = ""; var url = "<%=validateAction%>?uid="+<%=id%>; AJAXUtil.doRequstUsingGet(stateChange,url,true); } function stateChange(){ var xmlDoc = xmlHttpRequest.responseXML; var info = xmlDoc.getElementsByTagName('message'); var leftMoney = info[0].firstChild.data; if(parseFloat(leftMoney) < parseFloat($("exchange").value)){ $("validateMessage").innerHTML = "<font color='red'>兑换的金额大于账户余额!</font>"; $("exchange").value=""; $("RFInput").value=""; $("exchange").focus(); comFlag = false; } }
<font color="#ffcc00"> <input id="exchange" type="text" style="width:80px" οnkeyup="keyupCheck(this);" /> 元</font>