在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看看,或者去掉文件里的中文注释
posted on 2006-11-18 13:38
kelven 阅读(407)
评论(1) 编辑 收藏 所属分类:
Ajax