转 http://www.jb51.net/article/36678.htm

1.userInfo.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html"; charset="utf-8" />
    <title>getJSON获取数据</title>
    <script src="http://libs.useso.com/js/jquery/1.11.1/jquery.js"></script>
    <style type="text/css">
        #divframe{ border:1px solid #999; width:500px; margin:0 auto;}
        .loadTitle{ background:#CCC; height:30px;}
    </style>
</head>
<body>
<div id="divframe">
    <div class="loadTitle">
        <input type="button" value="获取数据" id="btn"/>
    </div>
    <div id="jsonTip">
    </div>
</div>
</body>
</html>
      <script type="text/javascript">
        $(function(){
            $("#btn").click(function(){
                $.getJSON("data//json//userInfo.json",function(data){
                    var $jsontip = $("#jsonTip");
                    var strHtml = "123";//存储数据的变量
                    $jsontip.empty();//清空内容
                    $.each(data,function(infoIndex,info){
                        strHtml += "姓名:"+info["name"]+"<br>";
                        strHtml += "性别:"+info["sex"]+"<br>";
                        strHtml += "邮箱:"+info["email"]+"<br>";
                        strHtml += "<hr>"
                    })
                    $jsontip.html(strHtml);//显示处理后的数据
                })
            })
        })
    </script>

2.data//json//userInfo.json

[
    {
        "name":"张国立",
        "sex":"男",
        "email":"zhangguoli@123.com"
    },
    {
        "name":"张铁林",
        "sex":"男",
        "email":"zhangtieli@123.com"
    },
    {
        "name":"邓婕",
        "sex":"女",
        "email":"zhenjie@123.com"
    }
]

jQuery读取json文件的更多相关文章

  1. jQuery读取json文件,实现省市区/县(国标)三级联动

    最近做一个微信项目,需要用户填写所在的省市区/县,决定使用jQuery读取json文件来实现省市区/县的联动. 其实很简单,jQuery文档也有详细解释: 代码如下: html <table w ...

  2. jquery无法读取json文件问题

    jquery无法读取json文件,如:user.json文件无法读取.把user.json文件的后缀名修改为aspx,文件内容不变,则可以读取~ 原理不懂!~~

  3. jqery ajax读取json文件

    json文件数据 [ {"name":"哈哈··","email":"邮箱01","gender": ...

  4. Unity 用C#脚本读取JSON文件数据

    读取JSON文件数据网上有很多方法吗,这里采用SimpleJSON,关于SimpleJSON的介绍参考以下链接:http://wiki.unity3d.com/index.php/SimpleJSON ...

  5. cocos2d-x 读取 json 文件并用 jsoncpp 做解析

    一码胜万言(请看注释) CclUtil.h // // CclUtil.h // PracticeDemo // // Created by kodeyang on 8/1/13. // // #if ...

  6. spring注解读取json文件

    开发时候在接口没有提供的时候,可以用json文件提前模拟接口数据 1.service层 package com.syp.spring.service; import java.io.File; imp ...

  7. Android - 读取JSON文件数据

    Android读取JSON文件数据 JSON - JavaScript Object Notation 是一种存储和交换文本信息的语法. JSON对象在花括号中书写.用逗号来分隔值. JSON数组在方 ...

  8. Asp.Net MVC 读取json文件

    有些系统上面的配置可以做成config里面的appsetting.这里要求写在json文件里面. 首先 添加命名空间 using Newtonsoft.Json; using System.IO; u ...

  9. Python json 读取 json 文件并转为 dict

    Python json 读取 json 文件并转为 dict 在 D 盘 新建 test.json: { "test": "测试\n换行", "dic ...

随机推荐

  1. RPD Volume 168 Issue 4 March 2016 评论2

    Influence of the phantom shape (slab, cylinder or Alderson) on the performance of an Hp(3) eye dosem ...

  2. n2n搭建手记-1-V1

    搭建环境 supernode :阿里云主机一台 aly1(Centos 6.5) edg2node:美团云机器两台 mty1,mty2(Centos 7.0) Step-1 各机器安装subviers ...

  3. 微信小程序开发教程(五)开发框架:MINA

    微信团队为小程序提供的框架命名为MINA应用框架.MINA框架通过封装微信客户端提供的文件系统.网络通信.任务管理.数据安全等基础功能,对上层提供一整套JavaScript API,让开发者能够非常方 ...

  4. 【kmp算法】poj2406 Power Strings

    如果next[n]<n/2,一定无解. 否则,必须要满足n mod (n-next[n]) = 0 才行,此时,由于next数组的性质,0~n-next[n]-1的部分一定是最小循环节. [ab ...

  5. 【dfs】【高斯消元】【异或方程组】bzoj1770 [Usaco2009 Nov]lights 燈 / bzoj2466 [中山市选2009]树

    经典的开关灯问题. 高斯消元后矩阵对角线B[i][i]若是0,则第i个未知数是自由元(S个),它们可以任意取值,而让非自由元顺应它们,得到2S组解. 枚举自由元取0/1,最终得到最优解. 不知为何正着 ...

  6. BUG:Yii登录时 101 net::ERR_CONNECTION_RESET

    Bug描述:YII web入口登录,无法登录一直等待,最终重定向 原因:设置的默认路由DefauRoute中的控制器中有错误,导致无法跳转找指定的路由规则 解决方案:这就多亏了SourceTree了, ...

  7. freedom isn't free

    财务自由(除去房和车) 第一阶段: 个人存款达到50万以上 第二阶段 个人存款100~200万 第三阶段 个人存款400万以上 第三阶段以上才能算实现了相对较好的财务自由!come on , boys ...

  8. 使用FluentValidation来进行数据有效性验证

    之前我介绍过了使用系统自带的Data Annotations来进行数据有效性验证,今天在CodePlex上逛的时候,发现了一个非常简洁好用的库:FluentValidation 由于非常简洁,就直接拿 ...

  9. convert image to base64

    ylbtech-Unitity-cs:convert image to base64 convert image to base64 1.A,效果图返回顶部   1.B,源代码返回顶部 1.B.1,c ...

  10. PHP Xdebug调试专题

    1.介绍与安装 Xdebug是一个PHP扩展,安装配置好后,可以自动记录运行了哪些函数,用了多少毫秒,从哪个文件运行到哪个文件等等 它记下来的调试信息很详细,对一些复杂程序跟踪调试有很大的辅助效果,能 ...