从JQuery.ajax成功数据中解析JSON

Question

我无法从JQery.ajax调用中获取JSON对象的内容.我的电话:

$('#Search').click(function () {
    var query = $('#query').valueOf();
    $.ajax({
        url: '/Products/Search',
        type: "POST",
        data: query,
        dataType: 'application/json; charset=utf-8',
        success: function (data) {
            alert(data);
            for (var x = 0; x < data.length; x++) {
                content = data[x].Id;
                content += "<br>";
                content += data[x].Name;
                content += "<br>";
                $(content).appendTo("#ProductList");
               // updateListing(data[x]);
            }
        }
    });
});

似乎正在正确返回JSON对象,因为"alert(data)"显示以下内容

[{"Id": "1", "Name": "Shirt"}, {"Id": "2", "Name":"Pants"}]

但是当我尝试使用以下命令向页面显示Id或Name时:

content = data[x].Id;
content += "<br>";
content += data[x].Name;
content += "<br>";

它会向页面返回"undefined".我究竟做错了什么？

谢谢您的帮助.

Answer 1

数据将作为JSON的字符串表示形式返回,并且您不会将其转换回JavaScript对象.将其设置dataType为仅'json'自动转换.

Answer 2

我建议你使用:

var returnedData = JSON.parse(response);

将JSON字符串(如果它只是文本)转换为JavaScript对象.

Answer 3

你可以确保这种类型的错误(使用字符串而不是json)不会发生的方法之一就是看看打印出来的是什么alert.当你这样做

alert(data)

如果data是一个字符串,它将打印包含的所有内容.但是如果你打印的是json对象.您将在警报中收到以下响应

[object Object]

如果这是响应,那么您可以确定可以将其用作对象(在本例中为json).

因此,在使用它之前,首先需要将字符串转换为json:

JSON.parse(data)

Answer 4

它工作正常，例如：

.ajax({

            url: "http://localhost:11141/Search/BasicSearchContent?ContentTitle=" + "?????",
            type: 'GET',
            cache: false,
            success: function (result) {

                //  alert(jQuery.dataType);
                if (result) {
                    //  var dd = JSON.parse(result);
                    alert(result[0].Id)
                }

            },
            error: function () {
                alert("No");
            }
        });

最后，您需要使用此语句...

result[0].Whatever

Answer 5

尝试使用 jqueryeach函数遍历您的 json 对象：

$.each(data,function(i,j){
    content ='<span>'+j[i].Id+'<br />'+j[i].Name+'<br /></span>';
    $('#ProductList').append(content);
});

Answer 6

嗯...你大约3/4的方式......你已经将JSON作为文本了.

问题是您似乎正在处理此字符串,就好像它已经是一个JavaScript对象,其属性与传输的字段有关.

它不是......它只是一个字符串.

查询如"content = data [x] .Id;" 必然会失败,因为JavaScript没有找到附加到它正在查看的字符串的这些属性...再次,它只是一个字符串.

您应该能够简单地将数据解析为JSON通过... yup ... JSON对象的解析方法.

myResult = JSON.parse(request.responseText);

现在myResult是一个javascript对象,包含通过AJAX传输的属性.

这应该允许你按照你想要的方式处理它.

看起来在添加ECMA5时添加了JSON.parse,所以任何相当现代的都应该能够原生地处理它......如果你必须处理化石,你也可以尝试使用外部库来处理它,比如jQuery或JSON2.

为了记录,Andy E已经在这里为其他人回答了这个问题.

编辑 - 看到"官方或可信来源"的请求,可能我认为最可靠的编码器之一是John Resig~ ECMA5 JSON ~我会链接到关于本机JSON支持的实际ECMA5规范,但我会而是将某人称为像Resig这样的大师,而不是干燥的规格.