[PHP]Ajax范例 _Ajax

[PHP]Ajax实例

ajax.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	 <head>
			<title>javascript的Ajax操作2</title>
			<meta http-equiv="pragma" content="no-cache"/>
			<meta http-equiv="cache-control" content="no-cache"/>
			<meta http-equiv="Content-Type" content="text/html; charset=gb2312"/>
			<meta name="author" content="Jarg Yee <yeshaoting@gmail.com>" />
			<script type="text/javascript">
			
			var xmlHttpRequest;		//用来装入XMLHttpRequest对象
			function Ajax()
			{
				xmlHttpRequest = createRequestObject();
				
				xmlHttpRequest.open("get", "ajax.php", true);
				xmlHttpRequest.onreadystatechange = requestCallBack;
				xmlHttpRequest.send();

			}

			
			/** 请求回调函数 */
			function requestCallBack()
			{
				/*
					0: 请求未初始化
					1: 服务器连接已建立
					2: 请求已接收
					3: 请求处理中
					4: 请求已完成，且响应已就绪
				*/
				switch(xmlHttpRequest.readyState)
				{
					case 0:
						showMessage("请求未初始化");break;
					case 1:
						showMessage("服务器连接已建立");break;
					case 2:
						showMessage("请求已接收");break;
					case 3:
						showMessage("请求处理中");break;
					case 4:
						showMessage("请求已完成，且响应已就绪");
						
						if(xmlHttpRequest.status == 200)
							showMessage(xmlHttpRequest.responseText);
						break;
				}
			}

			/** 显示XMLHttpRequest当前状态信息 */
			function showMessage(str)
			{
				var msg = document.getElementById("msg");
				msg.innerHTML = msg.innerHTML + "<br/>" + str;
			}
			
			/** XMLHttpRequest对象 */
			function createRequestObject()
			{
				var xmlHttpRequest;
				if(window.XMLHttpRequest)
				{// code for IE7+, Firefox, Chrome, Opera, Safari
					xmlHttpRequest = new XMLHttpRequest();
				}
				else if(window.ActiveXObject)
				{// code for IE6, IE5
					xmlHttpRequest = new ActiveXObject("Microsoft.XMLHTTP");
				}
				return xmlHttpRequest;
			}
			</script>
	 </head>

	 <body>
			<input type="button" value="Ajax提交" onclick="Ajax();" />
			<div id="msg">Ajax提交过程:</div>
	 </body>
</html>

ajax.php

<?php

	//header("content-Type: text/html; charset=gb2312");
	print "Ajax异步请求内容:ajax内容";

?>

效果:

Ajax提交过程:
请求已接收
请求处理中
请求已完成，且响应已就绪
Ajax异步请求内容:ajax内容