json只是一种文本字符串。

Smarty是一个使用PHP写出来的模板引擎。

ajax如何处理json数据格式

①json的格式如下：

"{属性名:属性值,属性名:属性值}"。

因为json数据是原生态的，因此这种数据格式很稳定，而且描述能力很强，我们建议使用json数据。

register.php

<!DOCTYPE html>

<html>

<head>

<title>用户注册</title>

<meta charset="utf-8">

<script language="javascript" type="text/javascript" >

    //创建ajax引擎

    function getXmlHttpObject(){

        var xmlHttpRequest;

        //不同浏览器获取xmlHttpRequest对象方法不一样

        if(window.ActiveXObject){

            //window.alert("ie");

            xmlHttpRequest=new ActiveXObject("Microsoft.XMLHTTP");

        }else{

            //window.alert("no ie");

            xmlHttpRequest=new XMLHttpRequest();

        }

        return xmlHttpRequest;

    }

    var myXmlHttpRequest="";

    //验证用户名是否存在

    function checkName(){

        myXmlHttpRequest=getXmlHttpObject();

        //怎么判断创建ok

        if(myXmlHttpRequest){

            var url="/registerProcess.php";

            //这个是要发送的数据

            var data="username="+$("username").value;

            //打开请求,准备发送,,true表示同步处理

            myXmlHttpRequest.open("post", url, true);

            //还有一句话，这句话必须

            //在编程过程中，建议用Post，post会更好一些

            myXmlHttpRequest.setRequestHeader("Content-Type","application/x-www-form-urlencoded");

            //指定回调函数.chuli是函数名

            myXmlHttpRequest.onreadystatechange=chuli;

            //真的发送请求，如果是get请求则填入 null即可

            //如果是post请求，则填入实际的数据

            myXmlHttpRequest.send(data);

            //状态改变的触发器

            //myXmlHttpRequest.open("get");

        }else{

            //window.alert("创建失败");

        }

    }

    //回调函数

    function chuli(){

        //window.alert("处理函数被调回"+myXmlHttpRequest.readyState);

        //我要取出从regiseterPro.php页面返回的数据

        if(myXmlHttpRequest.readyState==4){

            var mes=myXmlHttpRequest.responseText;

            //window.alert(mes);

            //使用eval函数将mes字串，转成对应的对象

            var mes_obj=eval("("+mes+")");

            /*window.alert(mes_obj.res);

            window.alert(mes_obj.id);

            window.alert(mes_obj.date);*/

            $("myres").value=mes_obj.res;

        }

    }

    function $(id){

        return document.getElementById(id);

    }

</script>

</head>

<body>

<form >

用户名字<input type="text" name="username1" id="username" /><input type="button" value="验证用户名" onclick="checkName()"/>

<input type="text" style="border-width:0;color:red" id="myres"/>

<br/>

用户密码<input type="password" name="password" id="password"/><br/>

电子邮件<input type="text" name="email" id="email"/><br/>

<input type="submit" value="用户注册"/><br/><br/>

用户名字<input type="text" name="username1" />

<input type="text" style="border-width:0;color:red"/>

<br/>

用户密码<input type="password" name="password"/><br/>

电子邮件<input type="text" name="email"/><br/>

<input type="button" value="用户注册"/>

</form>

</body>

</html>

registerProcess.php

<?php

    //这里两句话很重要，第一句话告诉浏览器返回的数据是xml格式

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

    //如果这里写成Content-type: text/html，会报错，得不到数据

    //告诉浏览器不要缓存数据

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

    //接收数据（这里要和请求方式对应 _POST 还是 _GET

    $username=$_POST['username'];

    $info="";

    if($username=="shunping"){

        $info='{"res":"该用户不可以用","id":"a001","date":"2011-11-11"}';//注意，这里数据是返回给请求的页面

    }else if($username!=""){

        $info='{"res":"该用户可以用","id":"a001","date":"2011-11-11"}';

    }

    echo $info;

?>

JSON(Javascript Object Notation)一种简单地数据格式，比xml更轻巧。

JSON是JavaScript原生格式，这意味着在javascript中处理JSON数据不需要任何特殊的API或工具包。

JSON数据格式很严格。

JSON的规则很简单：对象是一个无序的“”名称/值‘对’集合。

var mes=eval("("+'{"res":"该用户可以用","id":"a001","date":"2011-11-11"}'+")");

    window.alert(mes.res);

    //该代码可以运行

如同：

var mes_obj=eval("("+mes+")");

window.alert(mes_ob.res);

访问一组json数据。

var dogs=[{"name":"小明","age":"8"},{"name":"小狗","age":"3"}];

    window.alert(dogs[0].name);

    window.alert(dogs[0].age);

    window.alert(dogs[1].name);

    window.alert(dogs[1].age);

②json数据格式的扩展

如果服务器返回的json是多组数据，则格式应当如下：

$info="[{"属性名":"属性值",....},{"属性名":"属性值",....},...]";

在xmlhttprequest对象接收到json数据后，应当这样处理

//转成对象数组

var reses=eval("("+xmlhttprequest.responseText+")");

//通过reses可以取得你希望的任何一个值

reses[i].属性值

复杂的json数据读取

var people={

        "programmers":

        [

            {"firstName":"Brett", "email":"brett@"},

            {"firstName":"Jason", "email":"jason@"}

        ],

        "writer":

        [

            {"writer1":"宋江","age":"50"},

            {"writer2":"吴用","age":"30"}

        ],

        "sex":"男"

};

    window.alert(people.programmers[0].firstName);

    window.alert(people.writer[1].age);

    window.alert(people.sex);

register.php

<!DOCTYPE html>

<html>

<head>

<title>用户注册</title>

<meta charset="utf-8">

<script language="javascript" type="text/javascript" >

    //创建ajax引擎

    function getXmlHttpObject(){

        var xmlHttpRequest;

        //不同浏览器获取xmlHttpRequest对象方法不一样

        if(window.ActiveXObject){

            //window.alert("ie");

            xmlHttpRequest=new ActiveXObject("Microsoft.XMLHTTP");

        }else{

            //window.alert("no ie");

            xmlHttpRequest=new XMLHttpRequest();

        }

        return xmlHttpRequest;

    }

    var myXmlHttpRequest="";

    //验证用户名是否存在

    function checkName(){

        myXmlHttpRequest=getXmlHttpObject();

        //怎么判断创建ok

        if(myXmlHttpRequest){

            var url="/registerProcess.php";

            //这个是要发送的数据

            var data="username="+$("username").value;

            //打开请求,准备发送,,true表示同步处理

            myXmlHttpRequest.open("post", url, true);

            //还有一句话，这句话必须

            //在编程过程中，建议用Post，post会更好一些

            myXmlHttpRequest.setRequestHeader("Content-Type","application/x-www-form-urlencoded");

            //指定回调函数.chuli是函数名

            myXmlHttpRequest.onreadystatechange=chuli;

            //真的发送请求，如果是get请求则填入 null即可

            //如果是post请求，则填入实际的数据

            myXmlHttpRequest.send(data);

            //状态改变的触发器

            //myXmlHttpRequest.open("get");

        }else{

            //window.alert("创建失败");

        }

    }

    //回调函数

    function chuli(){

        //window.alert("处理函数被调回"+myXmlHttpRequest.readyState);

        //我要取出从regiseterPro.php页面返回的数据

        if(myXmlHttpRequest.readyState==4){

            var mes=myXmlHttpRequest.responseText;

            //使用eval函数将mes字串，转成对应的对象

            var mes_obj=eval("("+mes+")");

            //取出第一组信息的res

            /*window.alert(mes_obj[1].id);

            $("myres").value=mes_obj[0].res;*/

            //window.alert(mes_obj[1].age);

            //如果你希望遍历返回的json数据

            for(var i=0;mes_obj.length;i++){

                window.alert(mes_obj[i].res);

            }

        }

    }

    function $(id){

        return document.getElementById(id);

    }

</script>

</head>

<body>

<form >

用户名字<input type="text" name="username1" id="username" /><input type="button" value="验证用户名" onclick="checkName()"/>

<input type="text" style="border-width:0;color:red" id="myres"/>

<br/>

用户密码<input type="password" name="password" id="password"/><br/>

电子邮件<input type="text" name="email" id="email"/><br/>

<input type="submit" value="用户注册"/><br/><br/>

用户名字<input type="text" name="username1" />

<input type="text" style="border-width:0;color:red"/>

<br/>

用户密码<input type="password" name="password"/><br/>

电子邮件<input type="text" name="email"/><br/>

<input type="button" value="用户注册"/>

</form>

</body>

</html>

registerProcess.php

<?php

    //这里两句话很重要，第一句话告诉浏览器返回的数据是xml格式

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

    //如果这里写成Content-type: text/html，会报错，得不到数据

    //告诉浏览器不要缓存数据

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

    //接收数据（这里要和请求方式对应 _POST 还是 _GET

    $username=$_POST['username'];

    $info="";

    if($username=="shunping"){

        $info='[{"res":"该用户不可以用","id":"a001","date":"2011-11-11"},{"age":"该用户不可以用","id":"a005","date":"2011-11-11"}]';//注意，这里数据是返回给请求的页面

    }else if($username!=""){

        $info='[{"res":"该用户可以用","id":"a001","date":"2011-11-11"},{"res":"该用户可以用","id":"a001","date":"2011-11-11"}]';

    }

    echo $info;

?>

json格式小结

优点：

①作为一种数据传输格式，JSON与XML很相似，但是它更加轻巧。

②json不需要从服务器发送含有特定内容类型的首部信息。

缺点：

①语法过于严谨

②eval函数存在风险

小结

当一个ajax请求到服务器，服务器可以根据需求返回  三种格式的数据，那么我们应当选择哪一个？

1.如果你的项目经理没有特殊要求，建议使用json

2.如果数据需要重用，JSON文件是个不错的选择，其在性能和文件大小方面有优势

3.当远程应用程序未知时，XML文档是首选，因为XML是web服务领域的世界语。

4.若应用程序不需要与其他应用程序共享数据的时候，使用HTML片段来返回数据是最简单的。

xml是最通用的一种数据格式。

ajax技术返回json如何处理的更多相关文章

  1. Ajax调用返回json，xml数据类型(0517--pm)

    一.返回Json型数据: 1.主页面 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " ...

  2. spring mvc 避免IE执行AJAX时,返回JSON出现下载文件

    <!-- 避免IE执行AJAX时,返回JSON出现下载文件 --> <bean id="mappingJacksonHttpMessageConverter" c ...

  3. SpringMVC 避免IE执行AJAX时,返回JSON出现下载文件

    <?xml version="1.0" encoding="UTF-8"?> <!-- SpringMVC配置文件 --> <be ...

  4. dbda封装类（包括：返回二维数组、Ajax调用返回字符串、Ajax调用返回JSON）

    <?php class DBDA { public $host = "localhost"; public $uid = "root"; public $ ...

  5. Ajax--json（Ajax调用返回json封装代码、格式及注意事项）

    Ajax调用json封装代码<dbda.php>: //Ajax调用返回JSON public function JsonQuery($sql,$type=1,$db="mydb ...

  6. jquery ajax调用返回json格式数据处理

    Ajax请求默认的都是异步的 如果想同步 async设置为false就可以(默认是true) var html = $.ajax({ url: "some.php", async: ...

  7. 在使用Ajax请求返回json数据的时候IE浏览器弹出下载保存对话框的解决方法

    在使用Ajax请求返回json数据的时候IE浏览器弹出下载保存对话框的解决方法 最近在做一个小东西,使用kindeditor上传图片的时候,自己写了一个上传的方法,按照协议规则通过ajax返回json ...

  8. AJAX请求,返回json进行页面绑值

    AJAX请求,返回json进行页面绑值 后台 controller @RequestMapping(value = "backjson.do",method=RequestMeth ...

  9. ajax访问服务器返回json格式

    使用ajax访问服务器返回多条数据,比如返回一个表中的所有数据,页面该如何处理呢?如何获取数据呢?一直不会用ajax返回json格式,今天研究了下,分享给大家~ 首先需要引用服务,点击项目右键,添加引 ...

随机推荐

  1. SpringCloud如何配置Eureka授权

    现在已经成功的实现了一个Eureeka的服务启动以及微服务的注册配置操作,但是现在的程序有一个问题,你自己公司的Eureka服务应该可以注册的服务只能够是满足于认证要求的微服务,所有这样来在之前所进行 ...

  2. python在windows系统中打印中文乱码

    转自:http://www.111cn.net/phper/python/58920.htm 中文乱码对于程序开发人员来讲不是什么怪事情了,今天我在使用python打印中文时就出现乱码了,下面我们一起 ...

  3. hadoop常见算法（持续更新）

    1. 对以下数据进行排序,根据收入减去支出得到最后结余从大到小排序 账号 收入 支出 日期 zhangsan@163.com 6000 0 2014-02-20 lisi@163.com 2000 0 ...

  4. 刷脸支付真的来啦！华为nova3带你玩转酷时代~

    无论是不愿脱离手套的怕冷手. 或是沾满泥土芬芳的勤劳手. 还是挂着水滴的清洁手…… 每当这些时刻,打开支付宝认证支付, 指纹解锁的能力总是光彩尽失. 不过,就在华为nova 3的发布会上, 一项传说已 ...

  5. git学习之创建版本库（三）

    创建版本库 什么是版本库呢?版本库又名仓库,英文名repository,你可以简单理解成一个目录,这个目录里面的所有文件都可以被Git管理起来,每个文件的修改.删除,Git都能跟踪,以便任何时刻都可以 ...

  6. JSP 与 PHP、ASP、ASP.NET 等语言类似，运行在服务端的语言。

    JSP(全称Java Server Pages)是由 Sun Microsystems 公司倡导和许多公司参与共同创建的一种使软件开发者可以响应客户端请求,而动态生成 HTML.XML 或其他格式文档 ...

  7. 浏览器登录cookie

     <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.o ...

  8. Shell 编程基础 --语法高速入门

    简单的说shell就是一个包括若干行Shell或者Linux命令的文件.对于一次编写,多次使用的大量命令,就能够使用单独的文件保存下来,以便日后使用.通常shell脚本以.sh为后缀.第一行一定要指明 ...

  9. String、StringBuilder、 StringBuffer 深入分析 源代码解析

    java学习有一段时间了.但学习的东西都是框架等东西,java基础知识有点遗忘.所以重温一下java基础知识.写写文章里面有错的希望大家指正共同进步~~ 一.String 大家常常会说使用" ...

  10. Eight(经典题,八数码)

    Eight Time Limit: 10000/5000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total Subm ...