JSON响应和bootstrap-ajax问题

Question

我正在尝试使用此处找到的 bootstrap-ajax 插件，我可能会犯一些非常基本的初学者错误：bootstrap-ajax

我有一个非常基本的表单，其中包含一个提交按钮，它应该对外部页面执行 GET 请求，然后从该外部页面的 JSON 响应中更新指定的 div。

<div class="done-score" data-refresh-url="ajaxrefreshdiv.php">
Refresh Div
</div>

<div class="done-list">
Append Div
</div>

<a 
href="ajaxrefreshdiv.php" 
class="btn ajax" data-method="GET"
data-append=".done-list"
data-refresh=".done-score"
>

<i class="icon icon-check">
</i>
Done
</a>

在外部 php 页面上，我有以下代码：

<?
header('Content-type: application/json');
echo '
        [{"html":"THIS IS MY TEST"}]
     ';
?>

我也尝试过回显：

var data = {"html":"This is a test"};

从我看到的所有示例和教程来看，这似乎是正确的响应方式，但字符串没有显示在页面上，微调器也没有停止旋转（就像它仍在等待确认页面已响应）。然而，刷新 div 确实删除了初始文本并更新为空 div，因此我知道刷新工作正常。

我做错了什么？

更新

我已经验证问题肯定是我的 json 响应格式。我能够使用 php 创建一个数组，然后使用 json_encode 回显该数组，我的“html”键的值现在显示在 div 中。

$data=array(
'html' => '<div class="row-fluid">THIS IS MY TEST</div>'
);
echo json_encode($data)
;

但是微调器仍在旋转，好像脚本还在等待某种类型的验证一样？

Answer 1

我找到了问题的答案。以防万一其他人遇到同样的问题，这里是解决方案：

div 没有更新或刷新的问题（至少在这种特殊情况下）是由于 json 响应的格式不正确造成的。

包含初始按钮或表单的 div 消失或微调器持续旋转的问题： 在查看了一个工作示例的源代码后，我意识到您必须发回一个片段数组，其中包含要为包含 ajax 按钮或 ajax 表单的 div 刷新的 html 代码。