php怎么给ajax返回数据格式,ajax怎么处理服务器返回的数据类型

这次给大家带来ajax怎么处理服务器返回的数据类型，ajax处理服务器返回数据类型的注意事项有哪些，下面就是实战案例，一起来看一下。

其原理很简单，结构上基本不变，只是改变处理返回数据的方式.

1.Text/HTML格式这种返回类型处理很简单，直接就当作字符串用就行了.为了方便使用，封装成如下函数:/**

* @function 利用ajax动态交换数据(Text/HTML格式)

* @param url 要提交请求的页面

* @param jsonData 要提交的数据,利用Json传递

* @param getMsg 这个函数可以获取到处理后的数据

*/

function ajaxText(url,jsonData,getMsg)

{

//创建Ajax对象,ActiveXObject兼容IE5,6

var oAjax = window.XMLHttpRequest?new XMLHttpRequest():new ActiveXObject("Microsoft.XMLHTTP");

//打开请求

oAjax.open('POST',url,true);//方法,URL,异步传输

//发送请求

var data = '';

for(var d in jsonData) //拼装数据

data += (d + '=' +jsonData[d]+'&');

oAjax.setRequestHeader("Content-type","application/x-www-form-urlencoded");

oAjax.send(data);

//接收返回,当服务器有东西返回时触发

oAjax.onreadystatechange = function ()

{

if(oAjax.readyState == 4 && oAjax.status == 200)

{

if(getMsg) getMsg(oAjax.responseText);

}

}

}

服务器端返回数据格式如下:

例如://返回的是xml格式

//header("Content-Type:text/xml;charset=utf-8");

//返回的是text或Json格式

header("Content-Type:text/html;charset=utf-8");

//禁用缓存,是为了数据一样的前提下还能正常提交，而不是缓存数据

header("Cache-Control:no-cache");

$username = $_POST['username']; //获取用户名

if(empty($username))

echo '请输入用户名';

else if($username == 'acme')

echo '用户名已被注册';

else

echo '用户名可用';

调用格式如下:url = 'abc.php';

var jsonData={username:'acme',passw:'acme'};

ajaxText(url,jsonData,getMsg);

function getMsg(msg)

{

//do something

}

2.XML格式

返回的是一个XML DOM对象，解析其中的数据就类似于HTML DOM 编程. 比如通过name获取标签对象(数组形式)，再从该数组中获取需要的标签对象，再从标签对象中获取文本值.

函数如下:/**

* @function 利用ajax动态交换数据(XML格式)

* @param url 要提交请求的页面

* @param jsonData 要提交的数据,利用Json传递

* @param tagName 要获取值的标签名

* @param getMsg 这个函数可以获取到处理后的数据

*/

function ajaxXML(url,jsonData,tagName,getMsg)

{

//创建Ajax对象,ActiveXObject兼容IE5,6

var oAjax = window.XMLHttpRequest?new XMLHttpRequest():new ActiveXObject("Microsoft.XMLHTTP");

//打开请求

oAjax.open('POST',url,true);//方法,URL,异步传输

//发送请求

var data = '';

for(var d in jsonData) //拼装数据

data += (d + '=' +jsonData[d] + '&');

oAjax.setRequestHeader("Content-type","application/x-www-form-urlencoded");

oAjax.send(data);

//接收返回,当服务器有东西返回时触发

oAjax.onreadystatechange = function ()

{

if(oAjax.readyState == 4 && oAjax.status == 200)

{

var oXml = oAjax.responseXML; //返回的是一个XML DOM对象

var oTag = oXml.getElementsByTagName(tagName);

var tagValue = oTag[0].childNodes[0].nodeValue;

if(getMsg)getMsg(tagValue);

}

}

}

服务器端返回数据格式如下:

例如://返回的是xml格式

header("Content-Type:text/xml;charset=utf-8");

//返回的是text或Json格式

//header("Content-Type:text/html;charset=utf-8");

//禁用缓存,是为了数据一样的前提下还能正常提交，而不是缓存数据

header("Cache-Control:no-cache");

$username = $_POST['username']; //获取用户名

if(empty($username))

echo '请输入用户名'; //这些标签可以自定义

else if($username == 'acme')

echo '用户名已被注册';

else

echo '用户名可用';

调用格式如下:var url = 'abc.php';

var jsonData = {username:'acme'};

ajaxXML(url,jsonData,'mes',getMsg);

function getMsg(msg)

{

//do something

}

3.返回json

函数如下：/**

* @function 利用ajax动态交换数据(Text/HTML格式)，但是返回的是Json类型的文本数据

* @param url 要提交请求的页面

* @param jsonData 要提交的数据,利用Json传递

* @param getMsg 这个函数可以获取到处理后的数据

*/

function ajaxJson(url,jsonData,getMsg)

{

//创建Ajax对象,ActiveXObject兼容IE5,6

var oAjax = window.XMLHttpRequest?new XMLHttpRequest():new ActiveXObject("Microsoft.XMLHTTP");

//打开请求

oAjax.open('POST',url,true);//方法,URL,异步传输

//发送请求

var data = '';

for(var d in jsonData) //拼装数据

data += (d + '=' +jsonData[d] + '&');

oAjax.setRequestHeader("Content-type","application/x-www-form-urlencoded");

oAjax.send(data);

//接收返回,当服务器有东西返回时触发

oAjax.onreadystatechange = function ()

{

if(oAjax.readyState == 4 && oAjax.status == 200)

{

var json = eval('('+oAjax.responseText+')');//把传回来的字符串解析成json对象

if(getMsg)getMsg(json);

}

}

}

服务器端返回数据格式如下:

例如://返回的是xml格式

//header("Content-Type:text/xml;charset=utf-8");

//返回的是text或Json格式

header("Content-Type:text/html;charset=utf-8");

//禁用缓存,是为了数据一样的前提下还能正常提交，而不是缓存数据

header("Cache-Control:no-cache");

$username = $_POST['username']; //获取用户名

if(empty($username))

echo '{"mes":"请输入用户名"}';

else if($username == 'acme')

echo '{"mes":"用户名已被注册"}';

else

echo '{"mes":"用户名可用"}';

调用格式如下:url = 'abc.php';

var jsonData={username:'acme',passw:'acme'};

ajaxText(url,jsonData,getMsg);

function getMsg(msg)

{

//do something

}

为了方便使用，可以把三个函数合并.合并后的函数如下:/**

* @function 利用ajax动态交换数据

* @param url 要提交请求的页面

* @param jsonData 要提交的数据,利用Json传递

* @param getMsg 这个函数可以获取到处理后的数据

* @param type 接受的数据类型,text/xml/json

* @param tagName type = xml 的时候这个参数设置为要获取的文本的标签名

* @return 无

*/

function ajax(url,jsonData,getMsg,type,tagName)

{

//创建Ajax对象,ActiveXObject兼容IE5,6

var oAjax = window.XMLHttpRequest?new XMLHttpRequest():new ActiveXObject("Microsoft.XMLHTTP");

//打开请求

oAjax.open('POST',url,true);//方法,URL,异步传输

//发送请求

var data = '';

for(var d in jsonData) //拼装数据

data += (d + '=' +jsonData[d]+'&');

oAjax.setRequestHeader("Content-type","application/x-www-form-urlencoded");

oAjax.send(data);

//接收返回,当服务器有东西返回时触发

oAjax.onreadystatechange = function ()

{

if(oAjax.readyState == 4 && oAjax.status == 200)

{

if(type == 'text')

{

if(getMsg) getMsg(oAjax.responseText);

}

else if(type == 'json')

{

var json = eval('('+oAjax.responseText+')');//把传回来的字符串解析成json对象

if(getMsg)getMsg(json);

}

else if(type == 'xml')

{

var oXml = oAjax.responseXML; //返回的是一个XML DOM对象

var oTag = oXml.getElementsByTagName(tagName);

var tagValue = oTag[0].childNodes[0].nodeValue;

if(getMsg)getMsg(tagValue);

}

}

}

}

相信看了本文案例你已经掌握了方法，更多精彩请关注php中文网其它相关文章！

推荐阅读：