zoukankan      html  css  js  c++  java
  • ajax读取json数据

    首先建立json.txt文件
    
    {
    "programmers": [
    { "firstName": "Brett", "lastName":"McLaughlin", "email": "brett@newInstance.com" },
    { "firstName": "Jason", "lastName":"Hunter", "email": "jason@servlets.com" },
    { "firstName": "Elliotte", "lastName":"Harold", "email": "elharo@macfaq.com" }
    ],
    "authors": [
    { "firstName": "Isaac", "lastName": "Asimov", "genre": "science fiction" },
    { "firstName": "Tad", "lastName": "Williams", "genre": "fantasy" },
    { "firstName": "Frank", "lastName": "Peretti", "genre": "christian fiction" }
    ],
    "musicians": [
    { "firstName": "Eric", "lastName": "Clapton", "instrument": "guitar" },
    { "firstName": "Sergei", "lastName": "Rachmaninoff", "instrument": "piano" }
    ]
    }
    
    通过异步调用,来读取json数据
    
    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head runat="server">
    <script type="text/javascript">
    var xmlHttp;
    function createXMLHttpRequest()
    {
        if(window.ActiveXObject)
        {
            xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        else if(window.XMLHttpRequest)
        {
            xmlHttp = new XMLHttpRequest();
        }
    }
    function startRequest()
    {
        createXMLHttpRequest();
        try
        {
            xmlHttp.onreadystatechange = handleStateChange;
            xmlHttp.open("GET", "Json.txt", true);
            xmlHttp.send(null);
        }
        catch(exception)
        {
            alert("xmlHttp Fail");
        }
    }
    function handleStateChange()
    {   
        if(xmlHttp.readyState == 4)
        {       
            if (xmlHttp.status == 200 || xmlHttp.status == 0)
            {
                var result = xmlHttp.responseText;
                var json = eval("(" + result + ")");
                alert(json.programmers[0].firstName);//读取json数据
                //alert(json.sex);
            }
        }
    }
    </script>
    </head>
    <body>
        <div>
            <input type="button" value="AjaxTest" onclick="startRequest();" />
        </div>
    </body>
    </html>
  • 相关阅读:
    安装图形化界面
    cemtos安装python
    traceback说明
    python常用魔法函数
    python上传文件接口
    文件上传接口
    MongoDB安装与使用
    解决macOS系统向有跳板机的服务器传文件
    mac终端命令sftp
    linux下mysql服务安装
  • 原文地址:https://www.cnblogs.com/huidaoli/p/3617212.html
Copyright © 2011-2022 走看看