Question

我一直在尝试通过jQuery / AJAX读取JSON，但到目前为止它一直在返回undefined。

$.ajax({
    type: "POST",
    url: "php/ajax/retrieve.php",
    dataType: "json",
    success: function(data) {
      console.log(data);
      $("#items").html(data);

      $.each(data, function(key, val) {
        console.log(key + ' ' + val);
        $("#items").append('\
          <div class="item-section" id="' + key + '">\
          <div class="item">\
            <h3>' + val.current_status + '</h3>\
          </div>\
          </div>\
        ');
      });
    }
  });

在控制台内部，迭代内部日志的输出如下，但是当我尝试在HTML中添加val.current_status时，它只是说“undefined”：

0 {"id":"4","creation_date":"15 Jan 2015 - 07:32 AM","current_status":"Pending", [... and so on]

感谢任何帮助。

Answer 1

如果您的控制台输出“{"id":"4","creation_date":"15 Jan 2015 - 07:32 AM","current_status":"Pending"...”，那么您的“对象”是一个字符串，而不是JSON对象。看看下面的例子。您应该在控制台窗口中看到“[object Object]”。

我的猜测是你的服务器在某个时候意外地将JSON转换为字符串值，并带有转义引号等等。也许你已经两次调用JSON序列化程序了吗？

这就是为什么你不应该尝试将数据转换为控制台中的字符串。你在想它就像是一个C控制台，一切都必须是一个字符串才能理解它。浏览器控制台比这更聪明，更具交互性...您应该输出实际值，以便您可以看到它的类型并使用属性等：

console.log( key, val );

  var key = 0,
      val_str = "{\"id\":\"4\",\"creation_date\":\"15 Jan 2015 - 07:32 AM\",\"current_status\":\"Pending\"}",
      val_obj = {"id":"4","creation_date":"15 Jan 2015 - 07:32 AM","current_status":"Pending"};

  $( '#str' ).text( key + ' ' + val_str );

  $( '#obj' ).text( key + ' ' + val_obj );

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<div id="str"></div>
<div id="obj"></div>

Answer 2

迭代对象数组

$.each(data, function(i, val) {

    $.each(val, function(k, v) {
        // do something 
    });

});

JSON返回未定义

2 个答案: