您的位置:首页 > 其它

一个简单的ajax无刷新翻页的程序

2011-05-24 22:16 429 查看
index.php
<script type="text/javascript" src="ajax.js"></script>
<a href="#" onclick="funphp100('o')">o</a>
<a href="#"  onclick="funphp100('t')">t</a>
<a href="#" onclick="funphp100('x')">x</a>
<div id="php100"></div>

for.php
<?
if($id=$_GET[id]){
for($i=1;$i<10;$i++){
echo $id;
}
exit();
}
?>

ajax.php
var xmlHttp;
function $_xmlhttprequest(){
if(window.ActiveXObject){
xmlHttp=new ActiveXObject('Microsoft.XMLHTTP');
}else if(window.XMLHttpRequest){
xmlHttp=new XMLHttpRequest();
}
}

function funphp100(url){
$_xmlhttprequest();
xmlHttp.open("GET","for.php?id="+url,true);
xmlHttp.onreadystatechange=byphp;
xmlHttp.send(null);
}
function byphp(){
var byphp100=xmlHttp.responseText;
document.getElementById('php100').innerHTML=byphp100;
}

下面是制作等待进度条效果的程序,就是利用函数判断不同的数据传输状态
function byphp(){
if(xmlHttp.readyState==1){
document.getElementById('php100').innerHTML = "loading.....";
}
if(xmlHttp.readyState==4){
//在客户端检测传送的内容是否全部传完,下面语句在360急速浏览器中不支持
//  if(xmlHttp.Status==200){
var byphp100=xmlHttp.responseText;
document.getElementById('php100').innerHTML=byphp100;
//  }
}
}
方法XHR.readyState五种状态
XHR.readyState == 状态(0,1,2,3,4)
0:请求未初始化,还没有调用 open()。
1:请求已经建立,但是还没有发送,还没有调用 send()。
2:请求已发送,正在处理中(通常现在可以从响应中获取内容头)。
3:请求在处理中;通常响应中已有部分数据可用了,没有全部完成。
4:响应已完成;您可以获取并使用服务器的响应了。

方法XHR.status常见的几种状态 

XHR.status == 200,300,404 等

100——客户必须继续发出请求
101——客户要求服务器根据请求转换HTTP协议版本
200——成功
201——提示知道新文件的URL
300——请求的资源可在多处得到
301——删除请求数据
404——没有发现文件、查询或URl
500——服务器产生内部错误
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: