首先建立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>

ajax读取json数据的更多相关文章

  1. js进阶ajax读取json数据（ajax读取json和读取普通文本，和获取服务器返回数据（链接）都是一样的，在url处放上json文件的地址即可）

    js进阶ajax读取json数据(ajax读取json和读取普通文本,和获取服务器返回数据(链接)都是一样的,在url处放上json文件的地址即可) 一.总结 ajax读取json和读取普通文本,和获 ...

  2. ajax(读取json数据)

    ajax知识点: 语法:$.ajax(路由,请求方式,返回的数据类型,数据参数,回调函数) url: "路由", type:"",默认get请求(get或pos ...

  3. js读取json数据（php传值给js）

    <?php $array =array('fds','fdsa','fdsafasd');  // json_encode($array); ?> <html> <hea ...

  4. 通过JQuery的$.ajax()把 json 数据 post 给 PHP

    通过JQuery的$.ajax()把 json 数据 post 给 PHP时的几种情况: 无法在PHP中通过$_POST 以及 $_REQUEST 获取json数据,即 $json = $_POST[ ...

  5. 关于跨域读取json数据我的理解

    这两天在做关于读取json数据的插件,想用getJSON读取数据: $.getJSON(http://www.xxxx.com/Titles.js, function (data) { console ...

  6. JS-利用ajax获取json数据，并传入页面生成动态tab

    封装好的:ajax.js function ajax(url, fnSucc,fnFaild){ //1[创建] if(window.XMLHttpRequest){ var oAjax = new ...

  7. json数据的格式，JavaScript、jQuery读取json数据

    JSON:JavaScript 对象表示法(JavaScript Object Notation). JSON的特点: JSON 是纯文本 JSON 具有“自我描述性”(人类可读) JSON 具有层级 ...

  8. ajax 发送json数据时为什么需要设置contentType: "application/json”

    1. ajax发送json数据时设置contentType: "application/json”和不设置时到底有什么区别? contentType: "application/j ...

  9. ajax发送json数据时为什么需要设置contentType: "application/json”

    1. ajax发送json数据时设置contentType: "application/json”和不设置时到底有什么区别?contentType: "application/js ...

随机推荐

  1. DIV CSS设计时IE6、IE7、FF 与兼容性有关的特性(转载的)

    在网站设计的时候,应该注意css样式兼容不同浏览器问题,特别是对完全使用DIV CSS设计的网,就应该更注意IE6 IE7 FF对CSS样式的兼容,不然,你的网乱可能出去不想出现的效果! 所有浏览器 ...

  2. iOS开发--验证码

    第一步,拖两个空间textfiled和button到storyboard上的viewcontroller上. 第二步,拖线,链接到.h文件中代码如下: 1 @property (weak, nonat ...

  3. （转载）怎么写tab?

    演示地址:http://www.adanghome.com/js_demo/3/ =========================================================== ...

  4. SPRING IN ACTION 第4版笔记-第十章Hitting the database with spring and jdbc-001-Spring对原始JDBC的封装

    1.spring扩展的jdbc异常 2.Template的运行机制 Spring separates the fixed and variable parts of the data-access p ...

  5. React组件生命周期-正确执行运行阶段的函数

    一. 二. <!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset=" ...

  6. 关于J-LINK升级最新固件后无法连上的一点分析

    昨天升级了最新的 Keil MDK 4.53,怕它老是提示 J-Link 要升级,就去 SEGGER 的网站下了个最新版的 J-Link 软件包(4.46F 版的),装好后运行 J-Link Comm ...

  7. 如何用crontab运行一个图形化界面的程序

    crontab是linux中定时任务的 执行crontab -e可以编辑定时列表(export DISPLAY=:0 指定显示器或者export DISPLAY=localhost:0) 15 13 ...

  8. ubuntu下搭建cocos2dx编程环境－下

         前两篇介绍了cocos2d-x 下linux开发环境配置和android 环境配置问题.在这其中遇到很多问题,所以最后一篇分享一下在处理这些问题时,我是如何解决的,是怎么想的.同时总结一些解 ...

  9. qt resize() 和 geometry()

    resize(),设置的部件客户区的大小.只有当该部件被show后才生效,即geomery() 返回的才是 resize() 的客户区大小.

  10. CentOS如何开启ssh远程连接

    假设VPS采用centos,再假设用较新版本6.5. VPS上可能没有安装桌面,但一般来说都会安装ssh,并且防火墙默认开放22端口. 那就从ssh开始. # 安装ssh,默认已安装好 # yum i ...