微客导航 » 文章资讯 » php下的原生ajax请求用法实例分析

php下的原生ajax请求用法实例分析

2023-07-31 12:11:08 235

本文实例讲述了php下的原生ajax请求用法。分享给大家供大家参考，具体如下：

浏览器中为我们提供了一个JS对象XMLHttpRequet，它可以帮助我们发送HTTP请求，并接受服务端的响应。

意味着我们的浏览器不提交，通过JS就可以请求服务器。

ajax(AsynchronousJavascriptAndXML)其实就是通过XHR对象，执行HTTP请求。

1、创建XHR对象

varxhr=newXMLHttpRequest();//暂不考虑兼容

2、XHR的对象属性和方法

方法：
open("get/post",url,true/false);
//有参数则k=v&k1=v1这种形式
send(null);

属性：
//代表请求状态，不断变化，为4时，请求结束
readyState
//响应的内容
responseText
//响应的状态码200，403，404
status
//状态文字
statusText

事件：
//当readyState变化时会触发此事件
onreadystatechange=function(){};

3、通过XHR对象发送get请求




ajax

vaript=document.getElementById("con"); ipt.onblur=function(){ varcon=this.value; //创建XHR对象 varxhr=newXMLHttpRequest(); //设置请求URL varurl="./ajax.php?con="+con; //设置XHR对象readyState变化时响应函数 xhr.onreadystatechange=function(){ //readyState是请求的状态，为4表示请求结束 if(xhr.readyState==4){ //responseText服务器响应的内容 alert("服务器响应数据："+this.responseText); } }; //打开链接 xhr.open("get",url,true); //发送请求 xhr.send(null); }

ajax.php如下：


填入数据，当鼠标焦点离开input时，触发请求，弹出响应内容。  
4、通过XHR对象发送post请求
(1)、open()第1参数为post
(2)、POST的参数以k=v&k1=v1&k2=v2的形式拼接，并用send()发送
(3)、必须要设置Content-Type为application/x-www-form-urlencoded



ajax

varsub=document.getElementById("sub"); sub.onclick=function(){ varname=document.getElementById("name").value; varpwd=document.getElementById("pwd").value; //创建XHR对象 varxhr=newXMLHttpRequest(); //设置请求URL varurl="./ajax.php"; //设置XHR对象readyState变化时响应函数 xhr.onreadystatechange=function(){ //readyState是请求的状态，为4表示请求结束 if(xhr.readyState==4){ //responseText服务器响应的内容 alert("服务器响应数据："+this.responseText); } }; //打开链接 xhr.open("post",url,true); //设置请求头部 xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); //发送请求 xhr.send("name="+name+"&pwd="+pwd); }

ajax.php如下：

单击submit后发送post请求，弹出响应信息。

5、返回值json，html，text，xml

返回值只有两种text，和xml。不过text内容中可以是一段html或json结构的字符串。

(1)、返回json格式




ajax

varget=document.getElementById("get"); varcity=document.getElementById("city"); get.onclick=function(){ //创建XHR对象 varxhr=newXMLHttpRequest(); //设置请求URL varurl="./ajax.php"; //设置XHR对象readyState变化时响应函数 xhr.onreadystatechange=function(){ //readyState是请求的状态，为4表示请求结束 if(xhr.readyState==4){ //responseText服务器响应的内容 //通过eval把传来的json字符串转成对象 vardata=eval(this.responseText); varstr=""; for(varixindata){ str+=""+data[ix].name+""; } city.innerHTML=str; } }; //打开链接 xhr.open("get",url,true); //发送请求 xhr.send(null); }

ajax.php如下：

1,'name'=>'上海'),
array('id'=>2,'name'=>'北京'),
array('id'=>3,'name'=>'深圳'),
);
echojson_encode($data);

(2)、返回xml格式

xml通过responseXML来读取，responseXML不是字符串，是DOM对象。




ajax

varget=document.getElementById("get"); varnews=document.getElementById("news"); get.onclick=function(){ //创建XHR对象 varxhr=newXMLHttpRequest(); //设置请求URL varurl="./ajax.php"; //设置XHR对象readyState变化时响应函数 xhr.onreadystatechange=function(){ //readyState是请求的状态，为4表示请求结束 if(xhr.readyState==4){ //responseXML服务器响应的内容 vardata=this.responseXML; varstr=""; vartitle=data.getElementsByTagName("title"); str+="

"+title[0].childNodes[0].nodeValue+"

"; str+="

"+title[1].childNodes[0].nodeValue+"

"; str+="

"+title[2].childNodes[0].nodeValue+"

"; news.innerHTML=str; } }; //打开链接 xhr.open("get",url,true); //发送请求 xhr.send(null); }

ajax.php如下：



111
222
333

EOD;
echo$xml;

6、ajax的同步与异步

通过设置open()的第三个参数true/false，来查看请求的效果。

同步请求：

发送请求->等待结果->操作完成->继续后面代码。我们必须等待结果处理完毕后才能继续后面的代码，严格按照步骤一步一步执行。

异步请求：

发送请求->继续后面代码->响应结果接收完毕->操作结果。异步请求在发送请求之后没有等待结果的返回而是继续执行后面的代码，也就是说在结果返回之前用户可以操作其他东西。

更多关于PHP相关内容可查看本站专题：《PHP+ajax技巧与应用小结》、《PHP网络编程技巧总结》、《php字符串(string)用法总结》、《php+mysql数据库操作入门教程》及《php常见数据库操作技巧汇总》

希望本文所述对大家PHP程序设计有所帮助。

声明：本文内容来源于网络，版权归原作者所有，内容由互联网用户自发贡献自行上传，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任。如果您发现有涉嫌版权的内容，欢迎发送邮件至：czq8825#qq.com（发邮件时，请将#更换为@）进行举报，并提供相关证据，一经查实，本站将立刻删除涉嫌侵权内容。

返回顶部
3162201930
czq8825@qq.com

php下的原生ajax请求用法实例分析

热门推荐

随机推荐