zoukankan      html  css  js  c++  java
  • ajax返回son数据

    JSON 只是一种文本字符串。它被存储在 responseText 属性中
    为了读取存储在 responseText 属性中的 JSON 数据,需要根据 JavaScript 的 eval 语句。

    函数 eval 会把一个字符串当作它的参数。然后这个字符串会被当作 JavaScript 代码来执行。

    因为 JSON 的字符串就是由 JavaScript 代码构成的,所以它本身是可执行的

    //==============================register.php

    <html>

    <head>
    <title>用户注册</title>
    <meta http-equiv="content-type" content="text/html;charset=utf-8"/>
    <script type="text/javascript">
    //创建ajax引擎
    function getXmlHttpObject(){
    var xmlHttpRequest;
    //不同的浏览器获取对象xmlhttprequest 对象方法不一样
    if(window.ActiveXObject){
    xmlHttpRequest=new ActiveXObject("Microsoft.XMLHTTP");
    }else{
    xmlHttpRequest=new XMLHttpRequest();
    }
    return xmlHttpRequest;
    }
    var myXmlHttpRequest="";
    //验证用户名是否存在
    function checkName(){
    myXmlHttpRequest=getXmlHttpObject();
    //怎么判断创建ok
    if(myXmlHttpRequest){
    //通过myXmlHttpRequest对象发送请求到服务器的某个页面
    //第一个参数表示请求的方式, "get" / "post"
    //第二个参数指定url,对哪个页面发出ajax请求(本质仍然是http请求)
    //第三个参数表示 true表示使用异步机制,如果false表示不使用异步
    var url="/ajax_yhyz/registerProcess.php";
    //这个是要发送的数据
    var data="username="+$('username').value;
    //打开请求.
    myXmlHttpRequest.open("post",url,true);
    //还有一句话,这句话必须.
    myXmlHttpRequest.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
    //指定回调函数.chuli是函数名
    myXmlHttpRequest.onreadystatechange=chuli;
    //真的发送请求,如果是get请求则填入 null即可
    //如果是post请求,则填入实际的数据
    myXmlHttpRequest.send(data); 
    }
    }

    //回调函数
    function chuli(){
    if(myXmlHttpRequest.readyState==4){
    //json数据就像字符串一样
    var mes=myXmlHttpRequest.responseText;
    //使用eval函数将mes子串转化成对应的对象
    var mes_obj = eval("("+mes+")");
    $('myres').value = mes_obj.id;
    }
    }

    //这里我们写一个函数
    function $(id){
    return document.getElementById(id);
    }
    </script>
    </head>
    <body>
    <form action="???" method="post">
        用户名字:<input type="text"    name="username1" id="username"><input type="button" onclick="checkName();"  value="验证用户名">
        <input style="border- 0;color: red" type="text" id="myres">
        <br/>
        用户密码:<input type="password" name="password"><br>
        电子邮件:<input type="text" name="email"><br/>
        <input type="submit" value="用户注册">
        </form>
         <form action="???" method="post">
        用户名字:<input type="text" name="username2" >  
        <br/>
        用户密码:<input type="password" name="password"><br>
        电子邮件:<input type="text" name="email"><br/>
        <input type="submit" value="用户注册">
        </form>
    </body>

    </html>

    //===================================registerProcess.php

    <?php
    //这里两句话很重要,第一讲话告诉浏览器返回的数据是xml格式
    header("Content-Type: text/html;charset=utf-8");
    //告诉浏览器不要缓存数据
    header("Cache-Control: no-cache");
    //接收数据(这里要和请求方式对于 _POST 还是 _GET)
    $username=$_POST['username'];
    //这里我们看看如何处理格式是json
    $info="";
    if($username=="shunping"){
    $info.='{"res":"该用户不可以用","id":"001"}';//注意,这里数据是返回给请求的页面.
    }else{
    $info.='{"res":"该用户可以用","id":"001"}';
    }
    echo $info;
    ?>

  • 相关阅读:
    个人学期总结
    201571030130/201571030124《小学四则运算练习软件需求说明》结对项目报告
    201571030124/201571030130《小学生四则运算练习软件》结对项目报
    201571030124 四则运算
    201571030124 初读《构建之法》(Build To Win)有感
    个人学期总结
    201571030130/201571030124《小学四则运算练习软件软件需求说明》结对项目报告
    201571030130/201571030124《小学生四则运算练习软件》结对项目报
    201571030130 小学生四则运算练习软件项目报告
    读《现代软件工程——构建之法》有感
  • 原文地址:https://www.cnblogs.com/james1207/p/3358152.html
Copyright © 2011-2022 走看看