PHP中AJAX的使用(完整实例【大牛可飘过】)
2013-07-28 13:42
399 查看
有一段时间不写关于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代码如下:
后台PHP代码ajax.php
简单的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
<?php $hehe=$_GET['hehe']; echo $hehe; ?>
简单的AJAX用法事例到此为止,特为初学者而写,大牛可飘过……
相关文章推荐
- PHP中AJAX的使用(完整实例【大牛可飘过】)
- PHP中AJAX的使用(完整实例【大牛可飘过】)
- AJAX 跨域请求 – JSONP的使用,PHP实例详解
- jQuery使用$.ajax提交表单完整实例
- jQuery使用$.ajax提交表单完整实例
- ajax,json,php使用实例
- PHP AJAX JSONP实现跨域请求使用实例
- PHP AJAX JSONP实现跨域请求使用实例
- php AJAX POST的使用实例代码
- PHP AJAX JSONP实现跨域请求使用实例
- jquery中使用ajax的php实例
- PHP AJAX JSONP实现跨域请求使用实例
- PHP AJAX JSONP实现跨域请求使用实例
- PHP AJAX JSONP实现跨域请求使用实例
- PHP AJAX JSONP实现跨域请求使用实例
- php+mysql结合Ajax实现点赞功能完整实例
- PHP 使用 getJSON 实例 ajax
- PHP AJAX JSONP实现跨域请求使用实例
- AJAX 跨域请求 – JSONP的使用,PHP实例详解
- php+xml结合Ajax实现点赞功能完整实例