PHP中AJAX的使用（完整实例【大牛可飘过】）

来源：互联网发布：多个数最小公倍数算法编辑：程序博客网时间：2024/05/17 04:13

有一段时间不写关于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代码如下：

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 5 <title>无标题文档</title> 6 <script type="text/javascript"> 7 window.onload=function() 8 { 9     var oBtn1=document.getElementById('btn1');10     var oInput=document.getElementById("hehe");11     var oDiv=document.getElementById("div1");12     oBtn1.onclick=function()13     {14         var sValue=oInput.value;15         //alert(sValue);16         //1.创建Ajax对象17         //只兼容非IE6的浏览器18         if(window.XMLHttpRequest)19         {20             var oAjax=new XMLHttpRequest();21         }22         else23         {24             //IE625             var oAjax=new ActiveXObject('Microsoft.XMLHTTP');26         }27         //alert(oAjax);28         //2.连接服务器29         //open(传输方式，文件地址，同步还是异步（默认异步）)30         oAjax.open('get','ajax.php?hehe='+sValue,true);31         32         //3.发送请求33         oAjax.send();34         35         //4.接收返回36         oAjax.onreadystatechange=function()37         {38             39             //oAjax.readyState  记录步骤40             if(oAjax.readyState == 4)41             {    42                 if(oAjax.status == 200)43                 {44                     oDiv.innerHTML = oAjax.responseText;45                 }46                 else47                 {48                     alert("失败");49                 }50             }51             else52                 {53                     alert(oAjax.readyState);//记录步骤54                 }55         }56         //oAjax.send();57         58     }59 }60 </script>61 </head>62 63 <body>64     <form method="" action="ajax.php">65         呵呵：<input type="text" size=20 name="hehe" id="hehe">66         <input type="button" value="提交" id="btn1">67     </form>68     <div id="div1">69     </div>70 </body>71 </html>

后台PHP代码ajax.php

1 <?php2     $hehe=$_GET['hehe'];3     echo $hehe;4 ?>

简单的AJAX用法事例到此为止，特为初学者而写，大牛可飘过……

0 0