JavaScript实践——AJAX封装工具

写了一个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">&nbsp;<input id="exchange" type="text" style="width:80px" οnkeyup="keyupCheck(this);" />&nbsp;元</font>
 

 

 

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值