|
Posted on 2008-07-31 14:53 朱 阅读(117) 评论(0) 编辑 收藏
在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>
源代码里有中文的注释,是ansi的,如果你的网站或ie下选择编码为UTF-8,可能会导致错误,你把你ie的编码改成gb2312看看,或者去掉文件里的中文注释
文章来源: http://www.blogjava.net/zhangrenquan/articles/81915.html
|