jquery简单ajax示例_读取json文件数据
来自于《jquery权威指南》
--------------------------------------
点击button后,获取到json文件数据,显示如下:

Json文件:
[
{
"name":"王美丽",
"sex": "女",
"age":29
},
{
"name":"梁帅哥",
"sex": "男",
"age":30
}
]
index.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>jQuery</title>
<style type="text/css">
body,div,ul,li,p{margin: 0;padding: 0; font-size: 13px;}
ul{list-style-type: none;}
.load{width: 230px;border: solid 1px #666;padding: 10px;background-color: orange;} </style>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript"> $(function(){
$("#btn").click(function(){
var strHtml = "";
$.getJSON("a.json",function(data){
//alert("aaa");
$(".load").empty();
$.each(data, function(InfoIndex, Info){
strHtml += "姓名:" + Info['name'] + "<br />";
strHtml += "性别:" + Info['sex'] + "<br />";
strHtml += "年龄:" + Info['age'] + "<hr>";
});
$(".load").html(strHtml);//出了回调函数,strhtml似乎就为空?
}); });
}); </script>
</head>
<body>
<div class="load"></div>
<p><input type="button" id="btn" value="获取数据" /></p>
</body>
</html>
注意内容:
(1)$.getJSON 大小写问题;
(2)json数据格式书写正确。
jquery简单ajax示例_读取json文件数据的更多相关文章
- Unity 用C#脚本读取JSON文件数据
读取JSON文件数据网上有很多方法吗,这里采用SimpleJSON,关于SimpleJSON的介绍参考以下链接:http://wiki.unity3d.com/index.php/SimpleJSON ...
- Android - 读取JSON文件数据
Android读取JSON文件数据 JSON - JavaScript Object Notation 是一种存储和交换文本信息的语法. JSON对象在花括号中书写.用逗号来分隔值. JSON数组在方 ...
- IIS7.5支持解析读取.json文件数据
在站点中添加 MIME类型去支持Json文件的解析 添加mime类型 文件扩展名:.json MIME类型:application/json 添加成功后即可. 如果不能直接操作iis也可以直接在web ...
- jQuery读取json文件,实现省市区/县(国标)三级联动
最近做一个微信项目,需要用户填写所在的省市区/县,决定使用jQuery读取json文件来实现省市区/县的联动. 其实很简单,jQuery文档也有详细解释: 代码如下: html <table w ...
- jqery ajax读取json文件
json文件数据 [ {"name":"哈哈··","email":"邮箱01","gender": ...
- jquery无法读取json文件问题
jquery无法读取json文件,如:user.json文件无法读取.把user.json文件的后缀名修改为aspx,文件内容不变,则可以读取~ 原理不懂!~~
- 项目一:第四天 1、快递员的条件分页查询-noSession,条件查询 2、快递员删除(逻辑删除) 3、基于Apache POI实现批量导入区域数据 a)Jquery OCUpload上传文件插件使用 b)Apache POI读取excel文件数据
1. 快递员的条件分页查询-noSession,条件查询 2. 快递员删除(逻辑删除) 3. 基于Apache POI实现批量导入区域数据 a) Jquery OCUpload上传文件插件使用 b) ...
- Asp.Net MVC 读取json文件
有些系统上面的配置可以做成config里面的appsetting.这里要求写在json文件里面. 首先 添加命名空间 using Newtonsoft.Json; using System.IO; u ...
- node-webkit读取json文件
1.原理 node-webkit包含了node.js,node.js提供了处理json数据文件的方法,通过node.js提供的方法,我们可以比较方便地读取json文件. 2.示例 这里我们读取的文件是 ...
随机推荐
- VoIP常见编码的带宽计算
voip带宽计算VOIP计算方法与所选用的编码方法有关,而与哪个厂家的没有什么关系,公式如下: 带宽=包长度×每秒包数=包长度×(1/打包周期)=(Ethernet头+IP头+UDP头+RTP头+有效 ...
- Java经典练习题_Day04
一.选择题 1. 下列关于数组的说法正确的是:(A) A. 在Java中数组的长度是可变的 B. 数组中存储的数据的类型是相同的 C. 数组在进行扩容操作的时候源数组的地址不发生改变 D. int[] ...
- offset()和position()
网上百度都有的说明是 offset():获取匹配元素在当前视口的相对偏移. position():获取匹配元素相对父元素的偏移. 如果单纯写这两句话,这个博客毫无意义 这里我写下他俩的使用情况,希望对 ...
- shelve模块(超级好用~!)
''' python中的shelve模块,可以提供一些简单的数据操作 他和python中的dbm很相似. 区别如下: 都是以键值对的形式保存数据,不过在shelve模块中, key必须为字符串,而值可 ...
- 模拟admin组件自己开发stark组件之创建篇
admin组件 admin组件为我们提供了针对django管理页面 我们先简短来看下django的admin组件的启动流程,注册流程,url匹配过程 启动注册 1. 扫描所有应用下的注册了应用中的ad ...
- python学习(二十七) 元组
# 元组是不可变的,不能改变元素的值,也不能增加.减少元素my_tuple = (1, 2, 3, 3)print(my_tuple) # 查找元素位置print(my_tuple.index(2)) ...
- Win10 恢复后退键
转自:http://www.cnblogs.com/liubaicai/p/4368261.html 自带的几种风格的页面,竟然是用的左上角虚拟后退键,这种倒行逆施的行为微软你真是够了! 一定要把后退 ...
- Web api help page error CS0012: Type "System.Collections.Generic.Dictionary'2错误
1.在asp.net Boilerplate项目中,Abp.0.12.0.2,.net framework4.5.2.下载后添加了webApi的helpPage功能,调试出现错误. dubug : a ...
- pvalue for go kegg enrichment
Simple, fast implementation of Fisher’s exact test. . For example, for the following table: o Havi ...
- c++获取lua嵌套table某属性的值
开发环境:vs2012 lua版本:LuaJIT-2.0.2 lua文件作为配置文件,c++读取这个配置. lua配置结构如下 SceneConfig = { [] = { name =}, [] = ...