Ajax简易框架

[color=blue] 上个月写的一个简易ajax模板。也参考了一些网上的资料，本着“取之于网络，用之于网络”的原则，先将源代码贴出来，代码中有详细的注释。欢迎各种形式的讨论和指正，感谢每一位读者。[/color]

/**
 * Author:quxiaoyong<br/>
 * Date:2010年11月30日</br>
 * Description:Ajax通用模板</br>
 * Example:<br/><pre>
 * ----------------------------------------------------------------
 * var ajax = new Ajax("1.jsp");//var ajax = new Ajax();this.setRequestUrl("1.jsp");等效								
 * ajax.setParams("SingleTotalSum=6000");//设置参数列表			
 * ajax.setEncodeURI(true);//设置编码为true
 * ajax.setMethod('get');//将http设置为get方法
 * ajax.setElementID("singleTotalSum");//设置DOM元素ID
 * ajax.onLoading = function() {
 *		//Do what you want to do
 *	};
 *	ajax.onLoaded = function() {
 *		//Do what you want to do
 *	};
 *	ajax.onInteractive = function() {
 *		//Do what you want to do
 *	};
 *	ajax.onCompletion = function() {
 *		//Do what you want to do
 *	};
 *	ajax.runAjax();
 * ---------------------------------------------------------------
 * </pre>
 */
function Ajax(url) {

	//失败提示信息
	var _AjaxFailedAlert = "Your browser does not support the enhanced functionality of this website\n",

	//请求的url，不包含传递参数的纯地址
	_requestUrl = url,

	//请求方法，默认为post方式
	_method = "post",

	//请求时传递的参数
	_params = "",

	//是否要编码uri字符串
	_encodeURI = true,

	//是否要动态执行服务器端返回的脚本
	_execute = false,

	//DOM对象ID
	_elementID = "",

	_responseText = "",

	_responseXML = "";

	//设置请求的url
	this.setRequestUrl = function(_url) {
		_requestUrl = _url;
	};

	//获取请求的url
	this.getRequestUrl = function() {
		return _requestUrl;
	};

	//设置http方法
	this.setMethod = function(method) {
		method = method.toLowerCase();
		if (method == 'get' || method == 'post') {
			_method = method;
		}
	};

	//获取http方法
	this.getMethod = function() {
		return _method;
	};

	//设置参数列表
	this.setParams = function(params) {
		_params = params;
	};

	//获取参数列表
	this.getParams = function() {
		return _params;
	};

	//设置是否编码
	this.setEncodeURI = function(b) {
		_encodeURI = b == true;
	};

	//获取是否编码
	this.isEncodeURI = function() {
		return _encodeURI == true;
	};

	//设置是否动态执行服务器返回的脚本
	this.setExecuteScript = function(execute) {
		_execute = execute == true;
	};

	//获取是否动态执行服务器返回的脚本
	this.isExecuteScript = function() {
		return _execute == true;
	};

	//设置DOM元素ID
	this.setElementID = function(elementID) {
		_elementID = elementID;
	};

	//获取DOM的ID
	this.getElementID = function() {
		return _elementID;
	}

	//获取responseText的值
	this.getResponseText = function() {
		return _responseText;
	};

	//获取responseXMl的值
	this.getResponseXML = function() {
		return _responseXML;
	}

	//回调函数，加载中
	this.onLoading = function() {
	};

	//回调函数，加载完成
	this.onLoaded = function() {
	};

	//回调函数，加载完成，但还需要解析相应数据
	this.onInteractive = function() {
	};

	//回调函数，加载完成，且数据解析完毕
	this.onCompletion = function() {
	};

	//创建XHR对象，IE6及以下版本的浏览器需要用ActiveXObject对象创建
	this.createXHR = function() {
		this.XHR = window.XMLHttpRequest ? new XMLHttpRequest()
				: new ActiveXObject("Microsoft.XMLHTTP");
		if (!this.XHR) {
			this.failed = true;
		}
	};

	//设置参数
	this.setVariable = function(name, value) {
		//一个name，一个value再加一个等号，至少需要3个字符
		if (_params.length < 3) {
			_params = name + "=" + value;
		} else {
			_params += "&" + name + "=" + value;
		}
	};

	//编码名值对,并返回以等号连接后的字符串结果
	this.encodeVariable = function(name, value) {
		return (encodeURIComponent(name) + "=" + encodeURIComponent(value));
	};

	//编码字符串
	this.encodeURLString = function(s) {
		varArray = s.split("&");
		for ( var i = 0; i < varArray.length; i++) {
			urlVars = varArray[i].split("=");
			if (urlVars[0].indexOf('amp;') != -1) {
				urlVars[0] = urlVars[0].substring[4];
			}
			varArray[i] = this.encodeVariable(urlVars[0], urlVars[1]);
		}
		return varArray.join("&");
	};

	//eval允许动态执行javascript
	this.runResponse = function() {
		eval(_responseText);
	};

	//运行ajax主逻辑
	this.runAjax = function(url) {
		this.responseStatus = new Array(2);
		if (this.failed && _AjaxFailedAlert) {
			alert(_AjaxFailedAlert);
		} else {
			if (url) {
				if (_params.length) {
					this.setParams(this.getParams() + "&" + url);//_params = _params + "&" + url;
				} else {
					_params = url;
				}
			}
			if (_encodeURI) {
				var d = new Date();
				var timeval = d.getTime();
				_params = this.encodeURLString(_params);//编码
				this.setVariable("rndval", timeval);//追加时间参数，避免浏览器缓存
			}
			if (_elementID) {
				this.elementObj = document.getElementById(_elementID);
			}
			if (this.XHR) {
				var self = this;
				if (_method == 'get') {
					var totalURLString = _requestUrl + "?" + _params;
					this.XHR.open(_method, totalURLString, true);
				} else {
					this.XHR.open(_method, _requestUrl, true);
				}
				if (_method == 'post') {
					try {
						this.XHR.setRequestHeader('Content-Type',
								'application/x-www-form-urlencoded');
					} catch (e) {
					}
				}
				this.XHR.send(_params);
				this.XHR.onreadystatechange = function() {
					switch (self.XHR.readyState) {
					case 1:
						self.onLoading();
						break;
					case 2:
						self.onLoaded();
						break;
					case 3:
						self.onInteractive();
						break;
					case 4:
						_responseText = self.XHR.responseText;
						_responseXML = self.XHR.responseXML;
						self.responseStatus[0] = self.XHR.status;
						self.responseStatus[1] = self.XHR.statusText;
						self.onCompletion();
						if (_execute) {
							self.runResponse();
						}
						if (self.elementObj) {
							var elementNodeName = self.elementObj.nodeName;
							elementNodeName.toLowerCase();
							if (elementNodeName == 'input'
									|| elementNodeName == 'select'
									|| elementNodeName == 'option'
									|| elementNodeName == 'textarea') {
								self.elementObj.value = _responseText;
							} else {
								self.elementObj.innerHTML = _responseText;
							}
						}
						_params = "";
						break;
					}
				};
			}
		}
	};
	this.createXHR();
}