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.示例 这里我们读取的文件是 ...
随机推荐
- linux保存的设置用户/组ID（set-user-ID）的测试
直接贴代码和结果 // FileName: id.cpp #include <iostream> #include <unistd.h> using namespace std ...
- 【Leetcode 338】 Counting Bits
问题描述:给出一个非负整数num,对[0, num]范围内每个数都计算它的二进制表示中1的个数 Example:For num = 5 you should return [0,1,1,2,1,2] ...
- 使用BeanShell 对比取出来的值
描述: 使用BeanShell 对比取出来的值,如不一致,报错 步骤一: 使用json Extractor后置处理器,取出"登入成功" 使用BeanS hell断言: 语法: if ...
- 杂项-Server：Serv-U
ylbtech-杂项-Server:Serv-U Serv-U FTP Server,是一种被广泛运用的FTP服务器端软件,支持3x/9x/ME/NT/2K等全Windows系列.可以设定多个FTP服 ...
- configure: error: jpeglib.h not found.
编译出现错误: configure: error: jpeglib.h not found. 解决方法:yum install libjpeg libjpeg-devel -y libjpeg-dev ...
- Spring MVC中发布Restful Web服务
对于企业应用来说,数据是许多业务的命脉,软件通常是可替换的,但是多年积累的数据是永远不能替换的. 近些年来,以信息为中心的表述性状态转移(Representational State Tran ...
- Oracle关于date类型数据的总结
往Oracle数据库中插入日期型数据(to_date的用法) INSERT INTO FLOOR VALUES ( to_date ( '2007-12-20 18:31:34' , 'YYY ...
- Vmware虚拟机linux上网问题
1.虚拟机linux上网问题 1.1 VMware中虚拟机网络的三种设置 第一种:桥接(bridged) 第二种:NAT 第三种:Host only . 这种模式下仅主机可以上网,虚拟机不能上网. 1 ...
- angularJS开发碰到的问题
bootstarp css无法加载 http://stackoverflow.com/questions/27656503/how-to-make-yo-angular-load-bootstrap- ...
- Dev GridControl 选择行及绑定/获取List对象
GridControl绑定List对象一般是为了获取焦点行时直接获得该行代表的List对象,或者为了实现嵌套表格,对第一中情况,起始不用绑定List,绑定DataTable也可以实现获取对应List对 ...