如何用jQuery解析JSON数据？AJAX请求无报错但无法显示数据

咱们一步步拆解问题，你的代码里有几个关键错误导致数据无法正常展示：

1. JSON解析的参数写错了 #

你这里的代码：

var obj = jQuery.parseJSON('result');

犯了个低级错误——你把字符串'result'传给了解析方法，而不是AJAX请求返回的result变量！这会让parseJSON尝试解析字符串"result"（这根本不是合法的JSON），自然得不到正确的对象。

正确的写法有两种：

• 要么直接用变量解析：

  var obj = jQuery.parseJSON(result);
  

• 要么更省心，给AJAX请求加上dataType: 'json'，让jQuery自动帮你把响应解析成JSON对象，省掉手动解析的步骤：

  $.ajax({
    url: 'inc/show-date-delv.php',
    data: {"id": id},
    type: 'post',
    dataType: 'json', // 新增这个配置
    success: function(result){
      // 这里的result已经是解析好的JSON对象了，不用再调用parseJSON
      // 后续处理逻辑...
    }
  });
  

2. 返回的数据结构和你的访问方式不匹配 #

从你打印的结果来看，服务器返回的是一个以数字为键的对象集合，每个键对应的子对象才包含date属性。你现在直接写obj.date肯定找不到值——因为obj本身没有date这个属性，它的子对象才有。

如果想把所有日期都展示出来，可以遍历这个对象：

success: function(result){
  var targetDiv = $(".dataandtime .date div:last-child").empty();
  // 遍历每个子对象，把date添加到目标div里
  $.each(result, function(key, item){
    targetDiv.append('<span>' + item.date + '</span>'); // 用你需要的标签包裹日期
  });
}

如果只需要某个特定项的日期（比如键为"4"的那个），可以直接访问：

success: function(result){
  $(".dataandtime .date div:last-child").empty().append(result["4"].date);
}

3. 建议添加错误回调方便排查问题 #

为了以后能更快定位问题，建议给AJAX请求加上error回调，这样如果请求失败、解析出错，你能在控制台看到具体的错误信息：

$.ajax({
  url: 'inc/show-date-delv.php',
  data: {"id": id},
  type: 'post',
  dataType: 'json',
  success: function(result){
    // 成功处理逻辑
  },
  error: function(xhr, status, error){
    console.log("AJAX请求出错：", status, error);
    console.log("服务器返回内容：", xhr.responseText);
  }
});

把这些修改之后，你的数据应该就能正常显示在目标div里了。

内容的提问来源于stack exchange，提问作者alireza darvishi