jQuery ajax读取本地json文件的实例

json文件

{
  "first":[
    {"name":"张三","sex":"男"},
    {"name":"李四","sex":"男"},
    {"name":"王武","sex":"男"},
    {"name":"李梅","sex":"女"}
  ]
}

js：

方法一：

$.ajax({
  url: "ceshi.json",//json文件位置
  type: "GET",//请求方式为get
  dataType: "json", //返回数据格式为json
  success: function(data) {//请求成功完成后要执行的方法
    //each循环 使用$.each方法遍历返回的数据date
    $.each(data.first, function(i, item) {
      var str = '<div>姓名:' + item.name + '性别：' + item.sex + '</div>';
      document.write(str);
    })
  }
})

方法二：

jQuery.getJSON()是jQuery.ajax()函数的简写形式

// jQuery.getJSON( url [, data ] [, success ] )
$.getJSON("ceshi.json", "", function(data) {
  　 //each循环 使用$.each方法遍历返回的数据date
    $.each(data.first, function(i, item) {
      var str = '<div>姓名:' + item.name + '性别：' + item.sex + '</div>';
      document.write(str);
    })
});

以上这篇jQuery ajax读取本地json文件的实例就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。

赞 (0)

相关推荐

  • jQuery读取本地的json文件(实例讲解)

    最近写项目需要读取本地的json文件,然后悲催的发现前端新手的我居然不会,查查找找发现这东西并不难,但是应该是比较常用的,毕竟json太好用了! 我是直接用的 jquery 实现的,但是 Ajax 也可以,不过我用的Ajax的简约版 $.getJSON(url,function); 代码如下: function getScenemapData(){ var jsondata={}; $.getJSON("../server/php/files/scenedesc.json", func

  • jQuery中读取json文件示例代码

    jQuery中读取json文件示例代码

    json文件是一种轻量级的数据交互格式.一般在jquery中使用getJSON()方法读取. $.getJSON(url,[data],[callback]) url:加载的页面地址 data: 可选项,发送到服务器的数据,格式是key/value callback:可选项,加载成功后执行的回调函数 1.首先建一个JSON格式的文件userinfo.json 保存用户信息.如下: [ { "name":"张国立", "sex":"男&q

  • jQuery ajax读取本地json文件的实例

    json文件 { "first":[ {"name":"张三","sex":"男"}, {"name":"李四","sex":"男"}, {"name":"王武","sex":"男"}, {"name":"李梅"

  • php读取本地json文件的实例

    1.data.json文件 { "goods":[ { "type":1, "name":"wow精选", "product":[ { "id":98, "name":"真皮大衣", "title":"单桶原酿酒 威士忌 新春礼盒 限量独家", "titleDesc":"苏格兰麦

  • 读取本地json文件,解析json(实例讲解)

    模拟用户登录 # data.json 文件同目录下 [ { "id": 1, "username": "zhangshan", "password": "123qwe", "lock": false }, { "id": 2, "username": "lisi", "password": "123

  • Android读取本地json文件的方法(解决显示乱码问题)

    本文实例讲述了Android读取本地json文件的方法.分享给大家供大家参考,具体如下: 1.读取本地JSON ,但是显示汉字乱码 public static String readLocalJson(Context context, String fileName){ String jsonString=""; String resultString=""; try { BufferedReader bufferedReader=new BufferedReade

  • 解决JavaWeb读取本地json文件以及乱码的问题

    最近在开发项目的时候遇到一个问题,在myecilpes上使用googlede gson读取项目中的json文件成功,然后把项目发布到tomcat上再使用同样的方法,会提示"系统找不到指定的路径" 文件放在src/config/下 JsonParser parser = new JsonParser(); JsonObject object = (JsonObject) parser.parse(new FileReader("config/Test.json"));

  • 在vue中读取本地Json文件的方法

    其实关于这个问题,网上已经可以找到些方法,不过基本上没有完整的,或者是其中有些坑,下面写一下自己的亲身实践. 使用vue读取本地json文件需要安装vue-resource插件,然后使用它的$http.get来读取json文件. json文件应该是必须放在static目录下 然后使用npm install 命令安装vue-resource,太慢的话就使用淘宝镜像安装,安装完成后先引用这个组件. 在main.js文件中添加: import VueResource from 'vue-resourc

  • Java读取本地json文件及相应处理方法

    如下所示: //读取json文件地址 /* String path = getClass().getClassLoader().getResource("menu.json").toString(); path = path.replace("\\", "/"); if (path.contains(":")) { path = path.replace("file:/", ""); }

  • Nodejs读取本地json文件,输出json数据接口方式

    目录 Nodejs读取本地json文件,输出json数据接口 第一步:准备本地JSON文件 第二步:编写nodejs服务程序 第三步: 测试请求接口数据 nodejs读取本地json文件中文乱码 第一种方式 第二种方式 Nodejs读取本地json文件,输出json数据接口 第一步:准备本地JSON文件 F:\nodejs\data\test.json {     "code": 0,     "msg": "请求成功",     "d

  • iOS Swift读取本地json文件报错的解决方法

    前言 最近闲来无聊,本地了一个json读取,但没想到在用Swift测试数据发现加载本地json文件一直报以下错误: Error Domain=NSCocoaErrorDomain Code=3840 "JSON text did not start with array or object and option to allow fragments not set." UserInfo={NSDebugDescription=JSON text did not start with a

  • 利用jsonp解决js读取本地json跨域的问题

    利用jsonp解决js读取本地json跨域的问题

    前言 本文主要给大家介绍了关于使用jsonp解决js读取本地json跨域的相关内容,分享出来供大家参考学习,下面话不多说了,来一起看看详细的介绍吧 一 .问题描述 通过ajax方式读取本地json文件,谷歌浏览器会提示跨域错误,导致获取不到json数据. 跨域报错.png ajax获取json数据代码: $.ajax({ url: "file/employeejson.json",//json文件位置 type: "GET",//请求方式为get dataType:

随机推荐