jQuery中使用Ajax获取JSON格式数据示例代码.pdfVIP

jQuery中使⽤Ajax获取JSON格式数据⽰例代码 JSON(JavaScript Object Notation)是⼀种轻量级的数据交换格式。JSONM⽂件中包含了 关于“名称”和“值”的信息。有时候 们需要读取JSON格式的数据⽂件，在j Query 中可 以使⽤Aj ax或者 $.getJSON()⽅法实现。 下⾯就使⽤j Query读取mu ic .txt⽂件中的JSON数据格式信息。 ⾸先，mu ic .txt 中的内容如下： 代码如下: [ {optionKey:1, optionValue:Canon in D}, {optionKey:2, optionValue:Wind Song}, {optionKey:3, optionValue:Wings} ] 下来是HTML代码： 代码如下: di 点击按钮获取JSON数据/di input type=button id=button alue=确定 / di id=result/di 使⽤Aj ax获取JSON数据的j Query代码： 代码如下: $(document).ready(function(){ $(#button).click(function(){ $.ajax({ type:GET, url:music.txt, dataType:json, success:function(data){ ar 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){ ar music=ul; $.each(data,function(i,n){ music+=li+n[optionValue]+/li; }); music+=/ul; $(#result).append(music); }); return false; }); }); j Query Aj ax异步处理J on数据详解 jquery aj ax处理j on数据其实与其它aj ax处理数据没什么很⼤的改动， 们只要简单处 理⼀下aj ax部份的dataType数据类型等于j on 即可解决了。 使⽤ AJAX 请求来获得 JSON 数据，并输出结果： 代码如下: $(button).click(function(){ $.getJSON(demo_ajax_json.js,function(result){ $.each(result, function(i, field){ $(di ).append(field + ); }); }); }); 该函数是简写的 Aj ax 函数，等价于： 代码如下: $.ajax({ url: url, data: data, success: callback, dataType: json }); 发送到服务器的数据可作为查询字符串附加到 URL 之后。如果 data 参数的值是对象 （映射），那么在附加到 URL 之前将转换为字符串，并进⾏ URL 编码。 传递给 callback 的返回数据，可以是 JavaScript 对象，或以 JSON 结构定义的数组， 并使⽤ $.par eJSON() ⽅法进⾏解析。 从 te t .j 载⼊ JSON 数据并显⽰ JSON 数据中⼀个 name 字段数据： 代码如下: $.getJSON(test.js, function(json){ alert(JSON Data: + json.users[3].name); }); ⼀个与a p .net实例 ⾸先给出要传的j on数据：[{demoData:Thi I The JSON Data}] 1,使⽤普通的a