从JQuery.ajax成功数据解析JSON

我无法从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或名称时：

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

它将“未定义”返回到页面。我究竟做错了什么？

谢谢您的帮助。

数据以JSON的字符串表示形式返回，您无需将其转换回JavaScript对象。将设置dataType为仅'json'使其自动转换。

我建议您使用：

var returnedData = JSON.parse(response);

将JSON字符串（如果只是文本）转换为JavaScript对象。

您可以确保不会发生这种类型的错误（使用字符串而不是json）的一种方法是查看alert。当你做

alert(data)

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

[object Object]

如果这是响应，那么您可以确定可以将其用作对象（在这种情况下为json）。

因此，在执行以下操作之前，您需要先将字符串转换为json：

JSON.parse(data)

它工作正常，例如：

$.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

好吧...您大约是那里的3/4 ...您已经拥有JSON作为文本了。

问题是您似乎在处理该字符串，就好像它已经是一个具有与所传输字段相关的属性的JavaScript对象一样。

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

诸如“ content = data [x] .Id;”之类的查询 肯定会失败，因为JavaScript找不到正在查看的字符串所附加的这些属性...，它只是一个字符串。

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

myResult = JSON.parse(request.responseText);

现在，myResult是一个javascript对象，其中包含通过AJAX传输的属性。

那应该可以让您按照看起来要尝试的方式进行处理。

看起来像是在添加ECMA5时添加了JSON.parse，所以任何相当现代的东西都应该能够本地处理……如果您必须处理化石，还可以尝试使用外部库来处理此问题，例如jQuery或JSON2。

记录下来，Andy E已经为其他人在这里回答了。

编辑-看到了对“官方或可信来源”的请求，我发现最可信的编码员之一可能是John Resig〜ECMA5 JSON〜我将链接到有关本机JSON支持的实际ECMA5规范，但是我会而不是将某人推荐给像Resig这样的高手，而不是简单的说明书。

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

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

您可以使用jQuery parseJSON方法：

var Data = $.parseJSON(response);

输入类型按钮

<input type="button" Id="update" value="Update">

我已经在Perl中成功发布了AJAX表单。发布表单后，控制器将返回JSON响应，如下所示

$(function() {

    $('#Search').click(function() {
        var query = $('#query').val();
        var update = $('#update').val();

        $.ajax({
            type: 'POST',
            url: '/Products/Search/',
            data: {
                'insert': update,
                'query': address,
            },
            success: function(res) {
                $('#ProductList').empty('');
                console.log(res);
                json = JSON.parse(res);
                for (var i in json) {
                    var row = $('<tr>');
                    row.append($('<td id=' + json[i].Id + '>').html(json[i].Id));
                    row.append($('<td id=' + json[i].Name + '>').html(json[i].Name));
                    $('</tr>');
                    $('#ProductList').append(row);
                }
            },
            error: function() {
                alert("did not work");
                location.reload(true);
            }
        });
    });
});

在jQuery API中：设置为dataType，如果未指定，则jQuery将尝试$.parseJSON()根据响应的MIME类型（JSON文本的MIME类型为“ application / json”）来推断它（在1.4中，JSON将产生） JavaScript对象）。

或者，您可以将设置为dataType进行json自动转换。

我不确定您的设置出了什么问题。也许服务器未正确设置标头。不确定。从长远来看，您可以尝试一下

$.ajax({
    url : url,
    dataType : 'json'
})
.done(function(data, statusText, resObject) {
   var jsonData = resObject.responseJSON
})

解析并将其转换为js对象。

success: function(response) {
    var content = "";
    var jsondata = JSON.parse(response);
    for (var x = 0; x < jsonData.length; x++) {
        content += jsondata[x].Id;
        content += "<br>";
        content += jsondata[x].Name;
        content += "<br>";
    }
    $("#ProductList").append(content);
}