ASONG

?在ajax應用中，通常一個頁面要同時發送多個請求，如果只有一個XMLHttpRequest對象，前面的請求還未完成，后面的就會把前面的覆蓋掉，如果每次都創建一個新的XMLHttpRequest對象，也會造成浪費。解決的辦法就是創建一個XMLHttpRequset的對象池，如果池里有空閑的對象，則使用此對象，否則將創建一個新的對象。
??下面是我最近寫的一個簡單的類：
??
??/**
?? * XMLHttpRequest Object Pool
?? *
?? * @author legend <legendsky@hotmail.com>
?? * @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);
?? }
?? }
?? }
??};
??
??示例：
??<script type="text/JavaScript" src="xmlhttp.js"></script>
??<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);
??</script>