有一段时间不写关于AJAX的东西了，最近和同学参加个比赛，要做一个类似博客的东西，用到了AJAX的东西，在写东西之前为了再熟悉一下AJAX，自己做了个关于AJAX的小事例与大家分享一下。
AJAX在js里可谓是一个牛气冲天的一个词，我刚学的时候有点望名生畏。对于初学者来说AJAX看似很难，图书馆里有些关于AJAX的教程比板砖都厚，看了就不想学。但当你真正长用的东西其实就那么写。在这就不扯那些书上扯的AJAX的历史考古的淡了，不然的话会碎的，你懂的。OK直入正题。
在这呢我主要说一下AJAX的用法，原理就不多说了。
1.你要用AJAX首先得会js吧，这个不用多说。
首先你得NEW一个AJAX的对象，类必须得事例化才能使用，这个大家都知道对吧
第一步：var oAjax = new XMLHttpRequest();
但是为了兼容IE6这么蛋疼的浏览器一般这么写：
if(window.XMLHttpRequest)
{
var oAjax = new XMLHttpRequest();
}
else
{
//IE
var oAjax=new ActiveXObject("Microsoft.XMLHTTP");
}
到这为止对象就事例化好了。
2.第二步咱得给服务器连接起来吧，这是必须的啊；
用open();用法是这样的：open(传输方式，文件地址，同步还是异步（默认异步）)
oAjax.open('get','ajax.php?hehe='+sValue,true);
3.得发送请求吧：
oAjax.send();
4.就是接收返回值了，就不废话了，直接看代码吧：
oAjax.onreadystatechange=function()
{
//oAjax.readyState 记录步骤
if(oAjax.readyState == 4)
{
if(oAjax.status == 200)
{
oDiv.innerHTML = oAjax.responseText;
}
else
{
alert("失败");
}
}
else
{
alert(oAjax.readyState);//记录步骤
}
}
到此为止AJAX就OK了：
下面是我实验的完整事例：
html代码如下：
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script type="text/javascript">
window.onload=function()
{
var oBtn1=document.getElementById('btn1');
var oInput=document.getElementById("hehe");
var oDiv=document.getElementById("div1");
oBtn1.onclick=function()
{
var sValue=oInput.value;
//alert(sValue);
//1.创建Ajax对象
//只兼容非IE6的浏览器
if(window.XMLHttpRequest)
{
var oAjax=new XMLHttpRequest();
}
else
{
//IE6
var oAjax=new ActiveXObject('Microsoft.XMLHTTP');
}
//alert(oAjax);
//2.连接服务器
//open(传输方式，文件地址，同步还是异步（默认异步）)
oAjax.open('get','ajax.php?hehe='+sValue,true);
//3.发送请求
oAjax.send();
//4.接收返回
oAjax.onreadystatechange=function()
{
//oAjax.readyState 记录步骤
if(oAjax.readyState == 4)
{
if(oAjax.status == 200)
{
oDiv.innerHTML = oAjax.responseText;
}
else
{
alert("失败");
}
}
else
{
alert(oAjax.readyState);//记录步骤
}
}
//oAjax.send();
}
}
</script>
</head>
<body>
<form method="" action="ajax.php">
呵呵：<input type="text" size=20 name="hehe" id="hehe">
<input type="button" value="提交" id="btn1">
</form>
<div id="div1">
</div>
</body>
</html>后台PHP代码ajax.php
1 <?php
2 $hehe=$_GET['hehe'];
3 echo $hehe;
4 ?>简单的AJAX用法事例到此为止，特为初学者而写，大牛可飘过……
