如何用jQuery / JavaScriptparsingJSON数据?

我有一个AJAX调用返回一些像这样的JSON:

$(document).ready(function () { $.ajax({ type: 'GET', url: 'http://example/functions.php', data: { get_param: 'value' }, success: function (data) { var names = data $('#cand').html(data); } }); }); 

#cand div里面我会得到:

 [ { "id" : "1", "name" : "test1" }, { "id" : "2", "name" : "test2" }, { "id" : "3", "name" : "test3" }, { "id" : "4", "name" : "test4" }, { "id" : "5", "name" : "test5" } ] 

我怎样才能循环这些数据,并将每个名称放在一个div中?

8 Solutions collect form web for “如何用jQuery / JavaScriptparsingJSON数据?”

假设你的服务器端脚本没有设置正确的Content-Type: application/json响应头,你将需要通过使用dataType: 'json'参数向jQuery指出这是JSON。

然后你可以使用$.each()函数来遍历数据:

 $.ajax({ type: 'GET', url: 'http://example/functions.php', data: { get_param: 'value' }, dataType: 'json', success: function (data) { $.each(data, function(index, element) { $('body').append($('<div>', { text: element.name })); }); } }); 

或使用$.getJSON方法:

 $.getJSON('/functions.php', { get_param: 'value' }, function(data) { $.each(data, function(index, element) { $('body').append($('<div>', { text: element.name })); }); }); 

设置dataType:'json'会为你parsingjson

 $.ajax({ type: 'GET', url: 'http://example/functions.php', data: { get_param: 'value' }, dataType:'json', success: function (data) { var names = data $('#cand').html(data); } }); 

否则你可以使用parseJSON

 var parsedJson = $.parseJSON(jsonToBeParsed); 

这里是你如何迭代

 var j ='[{"id":"1","name":"test1"},{"id":"2","name":"test2"},{"id":"3","name":"test3"},{"id":"4","name":"test4"},{"id":"5","name":"test5"}]'; 

迭代使用each

 var json = $.parseJSON(j); $(json).each(function(i,val){ $.each(val,function(k,v){ console.log(k+" : "+ v); }); }); 

http://jsfiddle.net/fyxZt/4/

尝试下面的代码,它在我的项目中工作:

 //start ajax request $.ajax({ url: "data.json", //force to handle it as text dataType: "text", success: function(data) { //data downloaded so we call parseJSON function //and pass downloaded data var json = $.parseJSON(data); //now json variable contains data in json format //let's display a few items for (var i=0;i<json.length;++i) { $('#results').append('<div class="name">'+json[i].name+'</>'); } } }); 
  $(document).ready(function () { $.ajax({ type: 'GET', url: '/functions.php', data: { get_param: 'value' }, success: function (data) { for (var i=0;i<data.length;++i) { $('#cand').append('<div class="name">data[i].name</>'); } } }); }); 

使用该代码。

  $.ajax({ type: "POST", contentType: "application/json; charset=utf-8", url: "Your URL", data: "{}", dataType: "json", success: function (data) { alert(data); }, error: function (result) { alert("Error"); } }); 

好吧,我有同样的问题,我通过从[{"key":"value"}]删除[]来解决这个问题:

  1. 在你的PHP文件中,确保你打印的是这样的
 echo json_encode(array_shift($your_variable)); 
  1. 在你的成功function中做到这一点
  success: function (data) { var result = $.parseJSON(data); ('.yourclass').append(result['your_key1']); ('.yourclass').append(result['your_key2']); .. } 

也可以循环使用,如果你想

 var jsonP = "person" : [ { "id" : "1", "name" : "test1" }, { "id" : "2", "name" : "test2" }, { "id" : "3", "name" : "test3" }, { "id" : "4", "name" : "test4" }, { "id" : "5", "name" : "test5" } ]; var cand = document.getElementById("cand"); var json_arr = []; $.each(jsonP.person,function(key,value){ json_arr.push(key+' . '+value.name + '<br>'); cand.innerHTML = json_arr; }); <div id="cand"> </div> 

Json数据

 data = {"clo":[{"fin":"auto"},{"fin":"robot"},{"fin":"fail"}]} 

当检索

 $.ajax({ //type //url //data dataType:'json' }).done(function( data ) { var i = data.clo.length; while(i--){ $('#el').append('<p>'+data.clo[i].fin+'</>'); } }); 
  • 学习parsing器,解释器和编译器资源
  • 具有空括号的默认构造函数
  • Python代码从string中删除HTML标签
  • Java的HTMLparsing
  • parsing可用的街道地址,城市,州,从一个string拉链
  • 以友好的方式获取ffmpeg信息
  • LR(0)和SLRparsing有什么区别?
  • 你如何parsing一个在Ruby中的URL来获得主域名?
  • parsing一个算术expression式,并用Java构build一个树
  • 在重载决策algorithm中如何确定模糊度?
  • 正则expression式来检测分号结尾的C ++ for&while循环