AJAX中同时发送多个请求XMLHttpRequest对象处理方法

原地址：http://www.ugia.cn/?p=85

在ajax应用中，通常一个页面要同时发送多个请求，如果只有一个XMLHttpRequest对象，前面的请求还未完成，后面的就会把前面的覆盖掉，如果每次都创建一个新的XMLHttpRequest对象，也会造成浪费。解决的办法就是创建一个XMLHttpRequset的对象池，如果池里有空闲的对象，则使用此对象，否则将创建一个新的对象。

下面是我最近写的一个简单的类：

* XMLHttpRequest Object Pool** @author legend <[e-mail]>* @link http://www.ugia.cn/?p=85* @Copyright www.ugia.cn*/ var XMLHttp = {_objPool: [],_getInstance: function (){for (var i = 0; i < this._objPool.length; i ++){if (this._objPool[i].readyState == 0 || this._objPool[i].readyState == 4){return this._objPool[i];}}// IE5中不支持push方法this._objPool[this._objPool.length] = this._createObj();return this._objPool[this._objPool.length - 1];},_createObj: function (){if (window.XMLHttpRequest){var objXMLHttp = new XMLHttpRequest();}else{var MSXML = ['MSXML2.XMLHTTP.5.0', 'MSXML2.XMLHTTP.4.0', 'MSXML2.XMLHTTP.3.0', 'MSXML2.XMLHTTP', 'Microsoft.XMLHTTP'];for(var n = 0; n < MSXML.length; n ++){try{var objXMLHttp = new ActiveXObject(MSXML[n]);break;}catch(e){}}} // mozilla某些版本没有readyState属性if (objXMLHttp.readyState == null){objXMLHttp.readyState = 0;objXMLHttp.addEventListener("load", function (){objXMLHttp.readyState = 4;if (typeof objXMLHttp.onreadystatechange == "function"){objXMLHttp.onreadystatechange();}}, false);}return objXMLHttp;},// 发送请求(方法[post,get], 地址, 数据, 回调函数)sendReq: function (method, url, data, callback){var objXMLHttp = this._getInstance();with(objXMLHttp){try{// 加随机数防止缓存if (url.indexOf("?") > 0){url += "&randnum=" + Math.random();}else{url += "?randnum=" + Math.random();}open(method, url, true);// 设定请求编码方式setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');send(data);onreadystatechange = function (){if (objXMLHttp.readyState == 4 && (objXMLHttp.status == 200 || objXMLHttp.status == 304)){callback(objXMLHttp);}}}catch(e){alert(e);}}}}; 示例： <mce:script type="text/javascript" src="xmlhttp.js" mce_src="xmlhttp.js"></mce:script><mce:script type="text/javascript"><!--function test(obj){alert(obj.statusText);}XMLHttp.sendReq('GET', 'http://www.ugia.cn/wp-data/test.htm', '', test);XMLHttp.sendReq('GET', 'http://www.ugia.cn/wp-data/test.htm', '', test);XMLHttp.sendReq('GET', 'http://www.ugia.cn/wp-data/test.htm', '', test);XMLHttp.sendReq('GET', 'http://www.ugia.cn/wp-data/test.htm', '', test);alert('Pool length:' + XMLHttp._objPool.length);// --></mce:script>

 

demo 下载xmlhttp.js