使用AJAX请求PHP后端接口时响应仅返回单条记录如何解决

问题根因 #

你当前遇到的只返回单个字段的问题，核心是前端接收JSON响应后的处理逻辑错误，和后端数组构造环节无关：

• 后端返回的$result是由多个input标签字符串组成的数组结构，经过json_encode序列化后传给前端时，AJAX的success回调拿到的data也是JS数组类型
• jQuery的html()方法传入数组时，默认只会取数组的第一个元素渲染，所以你只能看到单个字段的内容

修复方案 #

1. 前端代码修改 #

只需要调整success回调里的渲染逻辑，把数组合并为完整字符串再传入html()即可：

<script type="text/javascript">
  $(document).on('click', '.pendingContent', function(){  
      var id=$(this).data("id");
      $.ajax({
              url: 'process.php',
              method:'post',
              dataType: "json", 
              data:{action:"pendingContent",id:id},  
              success: function(data){
                // 把数组所有元素拼接为完整HTML字符串后再渲染
                $('#shaedcontent').html(data.join(''));
                $("#pendingContent").modal('show');
              }
            });
      });
</script>

2. 后端代码优化（可选，避免部分场景下JSON解析异常） #

在输出JSON前添加响应头，明确指定返回内容类型为JSON，避免低版本浏览器解析错误：

$result=[];

if ($haschange['fb']==1) {
    $result[]="<input type='text' value='".$social_links['fb']."'>";
}
if ($haschange['twitter']==1) {
    $result[]="<input type='text' value='".$social_links['twitter']."'>";
}
if ($haschange['linkedin']==1) {
    $result[]="<input type='text' value='".$social_links['linkedin']."'>";
}
if ($haschange['instagram']==1) {
    $result[]="<input type='text' value='".$social_links['instagram']."'>";
}

// 新增JSON响应头
header('Content-Type: application/json');
echo json_encode($result);
exit();

如果修改后仍然只能拿到单个字段，可以在success回调里加console.log(data)打印数组内容，确认后端是否真的返回了多个元素，排查$haschange里的其他平台字段值是否确实为1即可。

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