Author: legend
Http://www.ugia.cn /? P = 85
In ajax applications, a page usually sends multiple requests at the same time. If there is only one XMLHttpRequest object, the previous request is not completed, and the subsequent request will overwrite the previous one, if a new XMLHttpRequest object is created each time, it will also cause waste. The solution is to create an XMLHttpRequset Object pool. If there is an idle object in the pool, use this object. Otherwise, a new object will be created.
Below is a simple class I recently wrote:
Copy codeThe Code is as follows:
/**
* 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];
}
}
// The push method is not supported in IE5.
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)
{
}
}
}
// Some mozilla versions do not have the readyState attribute
If (objXMLHttp. readyState = null)
{
ObjXMLHttp. readyState = 0;
ObjXMLHttp. addEventListener ("load", function ()
{
ObjXMLHttp. readyState = 4;
If (typeof objXMLHttp. onreadystatechange = "function ")
{
ObjXMLHttp. onreadystatechange ();
}
}, False );
}
Return objXMLHttp;
},
// Send the request (method [post, get], address, Data, callback function)
SendReq: function (method, url, data, callback)
{
Var objXMLHttp = this. _ getInstance ();
With (objXMLHttp)
{
Try
{
// Add random numbers to prevent caching
If (url. indexOf ("? ")> 0)
{
Url + = "& randnum =" + Math. random ();
}
Else
{
Url + = "? Randnum = "+ Math. random ();
}
Open (method, url, true );
// Set the Request Encoding Method
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 );
}
}
}
};
Example:
Copy codeThe Code is as follows:
<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>