|
锁定老帖子 主题：我也来发一个自己做的 ajax 简单封装
精华帖 (0) :: 良好帖 (1) :: 新手帖 (0) :: 隐藏帖 (15)
|
|
|---|---|
| 作者 | 正文 |
|
发表时间：2011-01-19
最后修改：2011-01-19
我也来发一个自己做的 ajax 简单封装，望多提意见。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>ajax</title>
<script type="text/javascript"><!--
function Ajax() {
var xmlHttpReq = null;
if (window.XMLHttpRequest) {
xmlHttpReq = new XMLHttpRequest();
} else {
if (window.ActiveXObject) {
var versions = ['Microsoft.XMLHTTP', 'MSXML.XMLHTTP', 'Microsoft.XMLHTTP',
'Msxml2.XMLHTTP.7.0', 'Msxml2.XMLHTTP.6.0',
'Msxml2.XMLHTTP.5.0', 'Msxml2.XMLHTTP.4.0',
'MSXML2.XMLHTTP.3.0', 'MSXML2.XMLHTTP'];
for(var i=0; i<versions.length; i++) {
try {
xmlHttpReq = new ActiveXObject(versions[i]);
if(xmlHttpReq) {
break;
}
} catch(e) {}
}
}
}
var handler = null;
this.invoke = function (mode, url, value, _handler) {
handler = _handler;
if(mode == 'get') {
var querystring = url+'?'+value+'&'+Math.random();
if(window.XMLHttpRequest) {
xmlHttpReq.open('GET', querystring);
xmlHttpReq.onreadystatechange = this.callback;
xmlHttpReq.send(null);
} else {
xmlHttpReq.open('GET', querystring, true);
xmlHttpReq.onreadystatechange = this.callback;
xmlHttpReq.send();
}
}
else if(mode == 'post') {
xmlHttpReq.open('POST', url);
xmlHttpReq.onreadystatechange = this.callback;
xmlHttpReq.setRequestHeader('Content-Type',
'application/x-www-form-urlencoded');
xmlHttpReq.send(value);
}
};
this.callback = function () {
if (xmlHttpReq.readyState == 4) {
if (xmlHttpReq.status == 200) {
handler(xmlHttpReq.responseText);
} else {
alert("请刷新页面！");
}
}
};
}
// 调用示例
new Ajax().invoke(
"get",
"/index.php",
'name=hello',
run
);
function run(response) {
alert(response);
}
// --></script>
</head>
<body>
</body>
</html>
服务端数据返回脚本：index.php <?php echo $_GET['name']; // echo $_POST['name']; ?> 兼容 IE、firefox、chrome 等浏览器。 var querystring = url+'?'+value+'&'+Math.random();，Math.random() 主要是进行 GET 请求时为了防止缓存。 发送请求时，对数据最好进行 urlencode 编码。 转载地址：http://www.xhttp.cn/2010/06/18 声明：ITeye文章版权属于作者，受法律保护。没有作者书面许可不得转载。
推荐链接
|
| 返回顶楼 | |
|
发表时间：2011-01-20
最近很多帖子都想投隐藏和新手帖
|
| 返回顶楼 | |
|
发表时间：2011-01-20
.....
this.invoke = function (mode, url, value, _handler) { 31. handler = _handler; 32. if(mode == 'get') { 33. var querystring = url+'?'+value+'&'+Math.random(); 34. if(window.XMLHttpRequest) { ...... 为什么要用Math.random(); 求解答！！！！ |
| 返回顶楼 | |
|
发表时间：2011-01-20
最后修改：2011-01-20
回楼上的，这是为了避免浏览器缓存造成的查询结果不变，而通过附加Math.random()来使得每次的请求不尽相同
|
| 返回顶楼 | |
|
发表时间：2011-01-21
mayEyeInfo 写道 .....
this.invoke = function (mode, url, value, _handler) { 31. handler = _handler; 32. if(mode == 'get') { 33. var querystring = url+'?'+value+'&'+Math.random(); 34. if(window.XMLHttpRequest) { ...... 为什么要用Math.random(); 求解答！！！！ 因为ie6比较懒，要是请求没有变，可能会造成不发送。 |
| 返回顶楼 | |
|
发表时间：2011-01-23
mirinda95925 写道 mayEyeInfo 写道 .....
this.invoke = function (mode, url, value, _handler) { 31. handler = _handler; 32. if(mode == 'get') { 33. var querystring = url+'?'+value+'&'+Math.random(); 34. if(window.XMLHttpRequest) { ...... 为什么要用Math.random(); 求解答！！！！ 因为ie6比较懒，要是请求没有变，可能会造成不发送。 随机数还是会造成重复，还是用+new Date好些 |
| 返回顶楼 | |
|
发表时间：2011-01-23
其实ajax框架最难得部分在于timeout。你能模拟出来嘛？多浏览器下效果不一样
|
| 返回顶楼 | |
|
发表时间：2011-01-24
rainsilence 写道 mirinda95925 写道 mayEyeInfo 写道 .....
this.invoke = function (mode, url, value, _handler) { 31. handler = _handler; 32. if(mode == 'get') { 33. var querystring = url+'?'+value+'&'+Math.random(); 34. if(window.XMLHttpRequest) { ...... 为什么要用Math.random(); 求解答！！！！ 因为ie6比较懒，要是请求没有变，可能会造成不发送。 随机数还是会造成重复，还是用+new Date好些 加时间戳一直是推荐的方式吧。 |
| 返回顶楼 | |
|
发表时间：2011-01-25
最后修改：2011-01-25
rainsilence 写道 其实ajax框架最难得部分在于timeout。你能模拟出来嘛？多浏览器下效果不一样
最难的的确是timeout。我在ajax系列之四，之五按检查超时，超时处理两部分来处理。 http://snandy.iteye.com/blog/738234 http://snandy.iteye.com/blog/738420 |
| 返回顶楼 | |
|
发表时间：2011-01-25
rainsilence 写道 mirinda95925 写道 mayEyeInfo 写道 .....
this.invoke = function (mode, url, value, _handler) { 31. handler = _handler; 32. if(mode == 'get') { 33. var querystring = url+'?'+value+'&'+Math.random(); 34. if(window.XMLHttpRequest) { ...... 为什么要用Math.random(); 求解答！！！！ 因为ie6比较懒，要是请求没有变，可能会造成不发送。 随机数还是会造成重复，还是用+new Date好些  ，是否取缓存数据，作为参数传入如何？
client 的选择会更多些。。 因为有时候，缓存的更好，比如图片。。 |
| 返回顶楼 | |
