Question

我正在使用带有ajax的jquery ui标签。

Ajax将面临这样的JSON内容。

[
  {
    "title"   :"a note",
    "type"    :"text",
    "content" :"MY FIRST NOTE!"
  },
  {
    "title"   :"two note",
    "type"    :"text",
    "content" :"MY FIRST NOTE <b>if html works<\/b> i should pay attention to this!"
  }
]

我正在使用此代码：

$(function() {
    $("#tabs").tabs({
        cache : false,
        ajaxOptions : {
            cache : false,
            dataType : 'json',
            dataFilter : function(result) {
                var data = $.parseJSON(result);
                return data;
            },
            error : function(xhr, status, index, anchor) {
                $(" anchor.hash ").html("Couldn't load this tab. We'll try to fix this as soon as possible. " + "If this wouldn't be a demo.");
            }
        }
    });
});

（我见过这个问题Loading JSON-encoded AJAX content into jQuery UI tabs）

JSON文件（由php生成）已正确加载，我已使用JSONLint对其进行了验证，但该选项卡仍为白色且内容未加载，是否可以帮助我？

这是我第一次使用JSON和Ajax，请原谅我，如果我做了一些愚蠢的错误

编辑：json内容与内容类型= application / json一起发送，删除显示json的内容类型，但我想用jquery解析json文件是可能的吗？

Answer 1

我认为你不应该调用$.parseJSON(result);，因为你指定了dataType : 'json'（看看我对这个问题的答案Why is 'jQuery.parseJSON' not necessary?），所以jQuery会为你解析响应。看另一个例子，你也应该返回

       dataFilter : function(result) {
            var data = $.parseJSON(result);
            return data.content;
        },

编辑 - 让dataType: 'json'这应该没问题

       dataFilter : function(result) {
            return result.content;
        },

Answer 2

由于此部分，内容未正确加载到选项卡：

dataType : 'json',
dataFilter : function(result) {
    var data = $.parseJSON(result);
    return data;
}

您以json的身份接收数据，因此result是javascript对象。但是$.parseJSON()需要字符串，而不是对象（see docs）。在dataType : 'html'时，它可以正常工作，因为使用此设置数据会以文本形式返回。

要解决此问题，您可以设置dataType : 'html'或删除dataFilter部分。当你以json格式请求数据时，jQuery在内部调用$.parseJSON()。

UPDATE ：还有一个信息，为什么你没有$.parseJSON()出现任何错误 - 从jQuery 1.4开始，如果JSON文件包含语法错误，请求通常会无提示失败see docs too

Answer 3

我发现将false返回beforeLoad处理程序并从getJSON处理程序中发送beforeLoad请求更为简单。请参阅我的回答here。

jQuery UI选项卡：JSON不显示

3 个答案: