Question

我有一些有效的JSON如下

[
    {
        "userFullName": "Tim, Bill",
        "id": "LOt3",
        "organisation": "FAP",
        "loginSystem": "A",
        "userId": 0
    },
    {
        "userFullName": "Bruce, David",
        "id": "LNA",
        "organisation": "ES",
        "loginSystem": "A",
        "userId": 0
    }
]

我试图在AJAX调用成功时访问JSON元素，如下所示：

success: function (data) {
    console.log('data ' + data);
    $.each(data, function (key, value) {
        console.log('id' + data[key].id);
        $('#selectStaff').append('<option value="' + data[key].id + '">' + data[key].id + '</option>');
    });
}

但是data[key].id正在返回undefined，如果我打印出data[key]，我会得到数组中的各个字符。

selectStaff是SELECT的ID。

我错过了什么？任何帮助将不胜感激。

由于

Answer 1

你要么必须使用JSON.parse(data)或将dataType选项添加到你的ajax函数中，所以它知道响应是JSON格式而不是别的。

....
 dataType:"json",
success: function (data) {
     javascript: console.log('data ' + data);
     $.each(data, function(key, value) {
     javascript: console.log('id' + data[key].id);
     $('#selectStaff').append('<option value="' + data[key].id+ '">' + data[key].id+ '</option>');
       });
}

或

 success: function (data) {
     javascript: console.log('data ' + data);
     data=JSON.parse(data);
     $.each(data, function(key, value) {
       .......

Answer 2

当数据被定义为对象时，您的代码在Fiddle中工作。

鉴于你声明：

如果我只是打印出数据[key]，我会得到数组的各个字符。

听起来你$.ajax调用的结果是返回一个字符串，而不是反序列化的JSON。您可以使用dataType参数强制反序列化：

$.ajax({
    dataType: 'json',
    // rest of your settings...
});

Answer 3

你需要解析json。

http://api.jquery.com/jQuery.getJSON/

http://api.jquery.com/jQuery.parseJSON/

Parse JSON in JavaScript?

// Assign handlers immediately after making the request,
// and remember the jqxhr object for this request
var jqxhr = $.getJSON( "example.json", function() {
  console.log( "success" );
})
  .done(function() {
    console.log( "second success" );
  })
  .fail(function() {
    console.log( "error" );
  })
  .always(function() {
    console.log( "complete" );
  });

// Perform other work here ...

// Set another completion function for the request above
jqxhr.complete(function() {
  console.log( "second complete" );
});

（以上摘自http://api.jquery.com/jQuery.getJSON/）

Answer 4

尝试使用jquery解析json：

success: function (data2) {
    var data=jQuery.parseJSON(data2);
    console.log('data ' + data);
    $.each(data, function (key, value) {
        console.log('id' + data[key].id);
        $('#selectStaff').append('<option value="' + data[key].id + '">' + data[key].id + '</option>');
    });
}

Answer 5

检查数据参数的类型，您想要接收一个对象。如果它不是一个对象，那么你需要解析它。

您可以指定为您处理它的数据类型：

$.ajax({
    datatype: 'json',
    // ...
});

或者你可以手动解析它：

if (typeof data === "string") {
    data = $.parseJSON(data);
}

JSON数据显示为数组

5 个答案: