AJAX&PHP交互
来源:互联网 发布:java银行项目面试技巧 编辑:程序博客网 时间:2024/06/05 01:00
AJAX实例
AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML)。它可以实现在不更新整个页面的情况下,与服务器交换数据更新部份页面的实用功能。
AJAX对象的创建很简单,一条javascript语句就可以完成:
var request = new XMLHttpRequest();
好了,现在已经创建好了一个ajax请求的实例“request”。当然XMLHttpRequest()可能会使人感觉疑惑,不要从字面去理解,据传这是因为当初并没有认为ajax会被如此广泛的使用而随意起的名字,在广泛应用后也就没办法更改了。
IE浏览器在比较老的版本上(IE6往前)是不支持这种方法的,微软在IE7中才开始支持XMLHttpRequest,所以如果你编写的脚本是要运行在比较古老的IE浏览器上时,请用另一种方法建立ajax实例。本文默认以现在使用最广泛的windows7附带的IE8为基础,不考虑之前IE版本的处理。
创建完了之后,就需要开启一个ajax连接了,开启链接的方法是:
request.open(method,url,boolean);
当然,”request”是我们在上一段刚刚创建的实例,它调用的是open方法,这个方法通常需要设置3个参数,分别代表以下含义:
method:指明链接的请求方法,GET或POST;url:指明请求的服务器端脚本,当使用GET方式时,url中也会带有传递给服务器脚本的参数;boolean:布尔值,是否使用异步,默认为true异步,false表示同步。
使用open方法建立完链接之后,就需要设置一个类似于监听触发器的东西了,用来在服务器完成请求的处理后返回数据的处理。
request.onreadystatechange = function(){……}
这样就设定了一个等待处理的方法,在ajax请求状态改变的时候就会触发这个函数体。说到这里有一点需要特别说明,那就是ajax的请求状态一共有5种,分别是0-4,具体的含义如下:
0:请求未初始化(open之前)1:请求已建立,但未发送(send之前)2:请求已发送,服务器端正在处理中3:请求处理中,服务器端还未生成响应4:响应已完成,可以获取到服务器端的响应
浏览器对这些状态的处理并不是完全按照说明进行,有一些状态位直接就被浏览器忽略了(当然它用到的可能性极小极小)。不同的浏览器对这些状态的处理也不一致,有的会有1-4状态位,有的会是2-4状态位,甚至也有3-4状态位的浏览器。所以在设置状态处理的时候,我们直接以状态位4来进行判断,这个状态位是所有浏览器都支持的,不会出现异常错误。
request.onreadystatechange = function(){ if(request.readyState == 4 && request.status == 200){ var tmp = request.responseText; alert(tmp); }}
是不是又发现了一个新的东西,request.status表示的是HTTP状态,状态码200表示一切正常,当这两个条件都满足的时候,你就可以放心的处理服务器端返回的数据了。
最后一个ajax方法是send,作用是向服务器端发送请求,它通常被放在整个ajax流程的最后一步来进行:
request.send();
如果使用的请求方法是GET,那么send方法就不需要参数(当然写个null也是可以的),如果是POST方式,那么send方法中就要指定所要传递给服务器端的参数。
现在一个基本的ajax请求已经完成了,让我们把它封装成个函数一起来看看:
function myAjax(){ var request = new XMLHttpRequest(); var url = "1.php?id=1&name=lucy"; request.open("GET",url,true); request.onreadystatechange = function(){ if(request.readyState == 4 && request.status == 200){ var tmp = request.responseText; alert(tmp); } }}request.send();
AJAX与PHP的交互
AJAX说完了,那就要实践一下,用一个最简单的例子,也不去获取页面的值,直接传送特定的值给服务器端php脚本来进行处理,php脚本名为1.php,HTML头尾部份就不写了。
<script>function myAjax(){ var request = new XMLHttpRequest(); var url = "1.php?id=1&name=lucy"; request.open("GET",url,true); request.onreadystatechange = function(){ if(request.readyState == 4 && request.status == 200){ var tmp = request.responseText; alert(tmp); } } request.send();}</script><body><input type="button" value="click me" onclick="myAjax();" /></body>
服务器端脚本1.php内容如下:
<?php$id = $_GET['id'];$name = $_GET['name'];if($id == 1 && $name == "lucy"){ $str = "Welcome $name,Your id=$id"; echo $str;}else{ echo "Input Infos Error!";}
运行这个简单至极的示例,我们可以获得一个结果,这个示例已经能够说明AJAX的基本运行。
服务器端返回的信息不可以是数组,所以当需要返回的信息比较多的时候,就可以使用json_encode将其转换成json格式的数据返回给AJAX请求;AJAX请求接收到服务器端返回的JSON格式数据后,并不能直接当做JSON格式数据进行处理,还需要进行一次转换,使用eval将返回信息转换成JSON格式数据后再进行处理。
以下是一个简单AJAX处理JSON格式返回数据的例子:
<script>function getMsg(){ var xmlReq = new XMLHttpRequest(); var url = "1.php?people=HiGoGo"; xmlReq.open("GET",url,true); xmlReq.onreadystatechange = function(){ if(xmlReq.readyState == 4 && xmlReq.status == 200){ var reptext = xmlReq.responseText; var tmp = eval ("("+reptext+")"); alert(tmp.address); } } xmlReq.send();}</script><body><input type="button" value="click me" onclick="getMsg();" /></body>
所请求的服务器端1.php内容:
<?php$tmp = $_GET['people'];if($tmp == "HiGoGo"){ $a = array( 'id'=>2001, 'name'=>'ljl', 'sex'=>'man', 'tel'=>186, 'address'=>'huilongguan east', 'birthday'=>'0705' ); $b = json_encode($a); echo $b;}
服务器端返回给AJAX请求的是一串有格式的字符信息,当AJAX请求要将这串信息以JSON格式来进行处理,则先使用javascript的eval方法将返回信息进行处理,然后就可以用对象的方法来使用返回数据中的值了。
需要说明的一些地方
1、AJAX是支持多种数据格式的,文本、XML和JSON都支持,相对来说XML的使用范围是比较狭窄的,更多的时候使用的是文本和JSON格式。这两种格式的数据都可以使用responseText来获取,XML格式的数据则需要使用responseXML来进行获取。
2、AJAX可以只获取HTTP头信息,在open方法中不使用GET或POST,使用HEAD,这样服务器返回的就是资源的头信息,获取头信息的方法是getAllResponseHeaders()。
3、当使用POST请求方式时,需要设置一个请求头信息,否则服务器端收不到传送的数据,头信息设置使用方法setRequestHeader(“Content-Type”,”application/x-www-form-urlencoded”),可以在open方法后设置。
4、AJAX请求在处理返回的JSON格式数据时,eval(“(“+responseText+”)”)中间的两个括号不能忽略,否则会产生语法错误。
- PHP与AJAX交互
- AJAX&PHP交互
- Highcharts、Ajax、PHP交互
- php json ajax 交互示例
- ajax与PHP,Asp交互
- PHP与ajax的交互
- Ajax+PHP简单数据交互
- PHP与Ajax的交互更新页面
- Ajax异步传输与PHP实现交互
- php ajax数据交互 不需要form提交
- php +ajax +sql 实现数据交互
- [Js笔记]Ajax通过GET方式与PHP进行交互
- jQuery ajax与php进行数据交互(数据格式问题)
- 用jquery +ajax 实现与php后台交互json数据
- [php] ajax交互实现选择用户名显示用户数据
- js和php通过Ajax无刷新数据交互
- Ajax异步交互与php请求响应的实现
- 关于 ajax php 交互的一些数据转换的
- 去掉tableview中section的headerview粘性
- Hashcode
- Jar包冲突解决方法
- cocos2d-js 计时器例子
- java中System.out.print();out的理解
- AJAX&PHP交互
- idea 控制台乱码
- CentOS6.5安装vncserver实现图形化访问
- TreeSet
- 使用SDWebImageView加载gif图片
- 2016-01-11 FFC
- CodeForces 611A New Year and Days
- iOS面试一般性问题
- UINavigationBar-设置