在AJAX调用中返回JSON和HTML

Iac*_*opo 2 javascript ajax optimization json

我有一些页面使用了大量的javascript(例如,对数据集进行排序和过滤).

典型的用法是显示复杂项目列表(通常<li>与内部的一些HTML一起呈现):用户可以删除,编辑或添加具有特定表单的项目.由于项目很复杂,我保留一组javascript对象来执行任何类型的操作,例如在执行任何操作之前验证用户输入.

用户的操作和详细信息通过异步调用发送到服务器:结果到达后,我必须更新HTML和javascript数组.

我使用这个hack:服务器将json编码的数据结构和更新的HTML作为单个字符串返回.在数据到达时,一些javascript代码拆分响应并将第一个块解析为json(更新数组)并将第二个块放入容器的内部html中,替换先前的内容.

我不想从数据结构生成HTML,因为它不是单人应用程序,并且Web设计人员经常(并且独立地)更改HTML布局.我都不想从HTML重新创建数据结构(过于复杂且容易出错).

这个系统运行得很好,只有大内容有一些问题,是跨浏览器(基于jQuery构建)并且似乎没有大的性能问题.

问题是:我是否遗漏了使这种解决方案变得糟糕的微妙(或可能是显而易见的)的东西?它是否存在更简单,更好的解决方案?

顺便说一句,服务器运行PHP.

谢谢.

sta*_*tch 7

为什么不将HTML字符串作为JSON的一部分返回?这样,您的输出更清晰.


TRi*_*RiG 6

所以你可能有两个变量:一个HTML字符串($html_string)和一个将以JSON格式发送的PHP信息数组($array_of_info).然后:

$a = array(
  'html' => $html_string,
  'json' => $array_of_info
);
header('Content-Type: application/json');
echo json_encode($a);
Run Code Online (Sandbox Code Playgroud)

这个输出略长于简单地连接HTML和JSON字符串,但客户端的解析应该更容易.而且可能更快.而且,正如评论中指出的那样,容易出错.