php100视频之Ajax+PHP打造等待进度条效果（二）【49讲】

今天要得到的效果图如下：

【注，这个图可以在百度搜loading.gif就有一大堆了】

这个是根据：php100视频之Ajax+PHP快速上手及应用（一）【第48讲】这里面的代码来改的

index.php不用改，要的的代码是ajax.js中的代码，更改代码如下：

// JavaScript Document
var xmlHttp;
function S_xmlhttprequest(){
		if(window.ActiveXObject){
				xmlHttp = new ActiveXObject('Microsoft.XMLHTTP');
			}else if(window.XMLHttpRequest){
				xmlHttp = new XMLHttpRequest();	
			}
	}
	
function funphp100(url){
		S_xmlhttprequest();
		xmlHttp.open("GET","for.php?id="+url,true);
		xmlHttp.onreadystatechange = byphp;
		xmlHttp.send(null);
	}
	
function byphp(){
		if(xmlHttp.readyState == 1){
				document.getElementById('php100').innerHTML = "<img src = loading.gif>";
			}
		if(xmlHttp.readyState == 4){
			if(xmlHttp.status == 200){
				var byphp100 = xmlHttp.responseText;
				document.getElementById('php100').innerHTML = byphp100;
			}
		}
	}

for.php里的代码添加一个sleep()函数，如下：

<?php 
if($id = $_GET[id]){
		for($i = 1; $i < 20; $i++)
			echo $id."<br>";
			sleep(1);
	}
?>

理论知识有：

XHR.readyState == 状态（0，1，2，3，4）的状态有5种：
0：请求未初始化，还没有调用 open()。
1：请求已经建立，但是还没有发送，还没有调用 send()。
2：请求已发送，正在处理中（通常现在可以从响应中获取内容头）。
3：请求在处理中；通常响应中已有部分数据可用了，没有全部完成。
4：响应已完成；您可以获取并使用服务器的响应了。



XHR.status == 200，300，404 等：
100——客户必须继续发出请求
101——客户要求服务器根据请求转换HTTP协议版本
200——成功 【这个是我们常用的】
201——提示知道新文件的URL
300——请求的资源可在多处得到
301——删除请求数据
404——没有发现文件、查询或URl
500——服务器产生内部错误