jQuery获取JSON格式数据方法
getJSON方法:
jQuery.getJSON(url,data,success(data,status,xhr))
$("button").click(function(){
$.getJSON("demo_ajax_json.js",function(result_data){
$.each(result_data, function(index, name_value){
$("div").append(name_value + " ");
});
});
});
| 参数 | 描述 |
|---|---|
| url | 必需。规定将请求发送的哪个 URL。 |
| data | 可选。规定连同请求发送到服务器的数据。 |
| success(data,status,xhr) |
可选。规定当请求成功时运行的函数。 额外的参数:
|
该函数是简写的 Ajax 函数,等价于:
$.ajax({
url: url,
data: data,
success: callback,
dataType: json
});
示例;
JSON(JavaScript Object Notation)是一种轻量级的数据交换格式。JSONM文件中包含了关于“名称”和“值”的信息。有时候我们需要读取JSON格式的数据文件,在jQuery中可以使用Ajax或者 $.getJSON()方法实现。
下面就使用jQuery读取music.txt文件中的JSON数据格式信息。
首先,music.txt中的内容如下:
[
{"optionKey":"1", "optionValue":"Canon in D"},
{"optionKey":"2", "optionValue":"Wind Song"},
{"optionKey":"3", "optionValue":"Wings"}
]
接下来是HTML代码:
<div>点击按钮获取JSON数据</div>
<input type="button" id="button" value="确定" />
<div id="result"></div>
使用Ajax获取JSON数据的jQuery代码:
$(document).ready(function(){
$('#button').click(function(){
$.ajax({
type:"GET",
url:"music.txt",
dataType:"json",
success:function(data){
var music="<ul>";
//i表示在data中的索引位置,n表示包含的信息的对象
$.each(data,function(i,n){
//获取对象中属性为optionsValue的值
music+="<li>"+n["optionValue"]+"</li>";
});
music+="</ul>";
$('#result').append(music);
}
});
return false;
});
});
当然,也可以使用$.getJSON()方法,代码简洁一点:
$(document).ready(function(){
$('#button').click(function(){
$.getJSON('music.txt',function(data){
var music="<ul>";
$.each(data,function(i,n){
music+="<li>"+n["optionValue"]+"</li>";
});
music+="</ul>";
$('#result').append(music);
});
return false;
});
});
示例来自CSDN《jQuery中使用Ajax获取JSON格式数据》
jQuery获取JSON格式数据方法的更多相关文章
- jQuery中使用Ajax获取JSON格式数据示例代码
JSON(JavaScript Object Notation)是一种轻量级的数据交换格式.JSONM文件中包含了关于“名称”和“值”的信息.有时候我们需要读取JSON格式的数据文件,在jQuery中 ...
- Jquery解析Json格式数据
今天稍微学习了一下Json,JSON (JavaScript Object Notation) 是一种轻量级的数据交换格式. 易于人阅读和编写.同时也易于机器解析和生成. JSON采用完全独立于语言的 ...
- jquery 获取json文件数据,显示到jsp页面上, 或者html页面上
[{"name":"中国工商银行","code":102},{"name":"中国农业银行",&qu ...
- jQuery调用ajax获取json格式数据
<body> <div>点击按钮获取音乐列表</div> <input type="button" id="button&quo ...
- 发送Ajax请求获取JSON格式数据
Aspx前端页面: <script type="text/javascript"> $(function () { $.getJSON("Ajax/TestA ...
- WebService返回json格式数据供苹果或者安卓程序调用
1.新建一个WebService. 2. /// <summary> /// DemoToJson 的摘要说明 /// </summary> [WebService(Names ...
- JQuery 获取json数据$.getJSON方法的实例代码
这篇文章介绍了JQuery 获取json数据$.getJSON方法的实例代码,有需要的朋友可以参考一下 前台: function SelectProject() { var a = new Array ...
- 使用getJSON()方法异步加载JSON格式数据
使用getJSON()方法异步加载JSON格式数据 使用getJSON()方法可以通过Ajax异步请求的方式,获取服务器中的数组,并对获取的数据进行解析,显示在页面中,它的调用格式为: jQuery. ...
- MVC4中视图获取控制器中返回的json格式数据
再开发MVC项目时,有时只需要从控制器中返回一个处理的结果,这时返回Json格式的数据非常的方便,在Controller中,提供了几种返回类型和方法,如: Content() 返回文本类型的Conte ...
随机推荐
- QTP中FSO的使用
序 FSO即文件系统对象(File System Object),在测试工作中有广泛的应有,它可以帮助我们自动生成测试目录,写日志,测试报告等.FSO有对象有很多属性和方法,今天只介绍几个常用的. 创 ...
- 行为树(Behavior Tree)实践(1)– 基本概念
原文地址:http://www.360doc.com/content/15/0107/11/15099545_438831036.shtml 自从开博以来,每天都会关心一下博客的访问情况,看到一些朋友 ...
- A - 棋盘问题
地图看起来不太大,可以试试深搜,试一下.. 还是比较简单的搜索,竟然一下就过................... #include<stdio.h> #include<) ...
- 软件设计模式 B卷
软件设计模式 试 卷(作业考核 线上) B 卷 学习中心: 院校学号: 姓名 (共 页 ...
- 每个项目单独配置 git 用户
git多账号登陆问题 设置git全局设置: git config --global user.name "your_name" git config --global user. ...
- Git学习之添加远程仓库
好久没有写过博客了,只因人生世事无常! 前言:说实话,早就听说了Git这个代码管理工具的NB之处,却一直没有时间好好学习下.现在终于有时间学习一下这个伟大的工具,在此写下在学习过程中遇到的问题! 推荐 ...
- log4j 日志的初始化
log4j 不指定时,log4j 会默认进行初始化,如果想要制定log4j.properties的位置时,可以进行指定: PropertyConfigurator.configure(): 参数里面加 ...
- js select 实现左右传值.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- POJ 1584 A Round Peg in a Ground Hole 判断凸多边形,判断点在凸多边形内
A Round Peg in a Ground Hole Time Limit: 1000MS Memory Limit: 10000K Total Submissions: 5456 Acc ...
- 解决Windows8前面板耳机无声的问题
Windows8已经到来不久了,相信很多朋友已经在使用,在使用时也许会遇到前面板耳机无声的问题,网上的其他办法很麻烦还不一定能解决,在这里我会给大家提供最简单的办法解决这个问题. 百度经验:jingy ...