Question

我的php文件中有一个JSON响应，如：

[
  {"id":"1"},
  {"archiveitem":"<small>26.06.2015 12:25<\/small><br \/><span class=\"label label-default\">Bug<\/span> has been submitted by Admin"}
]

尝试在单击按钮后将此响应提取到div中，但是firebug告诉我来自错误处理程序的消息。我无法弄清楚这个问题？

$('#loadarchive').click(function(){
    $.ajax({
        type: 'post',
        url: '/src/php/LoadAdminDashboardArchive.php',
        dataType: 'json',
        data: {
            action : 'getArchive'
        },
        success: function(results) {
            var archiveelements = JSON.parse(results);
            console.log(results);
            $.each(archiveelements, function(){
                $('#archivecontent').html('<div class="mark-read-container"><span class="btn-mark-unread" id="' + this.id + '">Unarchive</span></div><div class="bs-callout bs-callout-default">' + this.archiveitem + '</div>');
            });
        },
        error: function(){
            console.log('Cannot retrieve data.');
        }
    });
});

Answer 1

我试图运行你的代码而我

SyntaxError: JSON.parse: unexpected character at line 1 column 2 of the JSON data

通过定义dataType: 'json'，您的结果已经被解析为数组。所以你可以这样做：

success: function (results) {
    if (results["head"]["foo"] != 0) {
        // do something
    } else if (results["head"]["bar"] == 1) {
        // do something
    }
}

这可以在我的电脑上运行：

$.ajax({
    type: 'post',
    url: '/src/php/LoadAdminDashboardArchive.php',
    dataType: 'json',
    data: { action : 'getArchive' },
    success: function(results) {
        console.log(results);
        $.each(results, function(){
            $('#archivecontent').html('<div class="mark-read-container"><span class="btn-mark-unread" id="' + this.id + '">Unarchive</span></div><div class="bs-callout bs-callout-default">' + this.archiveitem + '</div>');
        });
    },
    error: function(){
        console.log('Cannot retrieve data.');
    }
});

Answer 2

如果您再深入了解一下，您可以从控制台获取更多信息。或者通过记录这两个参数：

error: function(xhr, mssg) {
    console.log(xhr, mssg);
}

Answer 3

<强>第一你的回答不正确，正确的回答应该是这样的

[{
  "id":"1",
  "archiveitem":"<small>26.06.2015 12:25<\/small>
<br \/><span class=\"labellabel-default\">Bug<\/span> has been submitted by Admin"
},
{
  ...
}]

<强>第二你不必解析结果即。JSON.parse不是必需的，因为dataType:'json'可能会处理json。

最后，您的成功方法应如下所示：

 success: function(results) {
            $.each(results, function(ind,el){
                $('#archivecontent').html('<div class="mark-read-container"><span class="btn-mark-unread" id="' + el.id + '">Unarchive</span></div><div class="bs-callout bs-callout-default">' + el.archiveitem + '</div>');
            });
        },

Answer 4

正如你所说的那样，来自错误处理程序的消息正在显示。

这意味着由于URL不正确或任何其他原因，AJAX永远不会发送到服务器。

在Firefox中使用Firebug并在控制台选项卡中查看错误。

我也看到了你的代码

dataType: 'json',
data: { action : 'getArchive' },
success: function(results) {
    var archiveelements = JSON.parse(results);
}

不要使用JSON.parse(results)，因为您已经编写了dataType: 'json',并且会自动解析任何类型的响应。

Answer 5

我能够让它工作，问题很简单......

我忘了粘贴“按钮” - 启动ajax请求的源代码。它是“提交”类型的输入，因此在成功检索到响应后默认重新加载页面...所以e.preventDefault（）;是要走的路。

感谢你们所有人。

jQuery AJAX无法使用JSON响应

5 个答案: