Javascript 使用JQuery/Ajax解析JSON时出现的问题

我正在通过JQuery/JSON访问API。我可以使用以下方法在页面上显示整个JSON块：

$.ajax({
    type: 'GET',
    url: url,
    dataType: 'json',
    contentType: 'application/json',
    headers: {'Access-Control-Allow-Origin': '*'},
    beforeSend: function (xhr){
        xhr.setRequestHeader('Authorization', 'Basic ' + btoa('un:pw'));
    },
    error: function(jqXHR, textStatus, data){
        console.log("(1)Static error message");
        console.log("(2)Output of textStatus " + textStatus);
        console.log("(3)Output of data " + data);
    },
    success: function(data) {
        var myData = data;
        $('#myData').html('<p>'+ myData +'<p>') 
    }
})

我试图输出如下内容：

$.ajax({
    type: 'GET',
    url: url,
    dataType: 'json',
    contentType: 'application/json',
    headers: {'Access-Control-Allow-Origin': '*'},
    beforeSend: function (xhr){
        xhr.setRequestHeader('Authorization', 'Basic ' + btoa('un:pw'));
    },
    error: function(jqXHR, textStatus, data){
        console.log("(1)Static error message");
        console.log("(2)Output of textStatus " + textStatus);
        console.log("(3)Output of data " + data);
    },
    success: function(data) {
        var myData = data;
        $('#myData').html('<p>'+ myData +'<p>') 
    }
})

项目

ID:XYZ

案例：123

第1区：

• 身份证号码：ABC
• 主题：321

第2区：

• ID:EFG
• 主题：456

---

项目

ID:HIJ

案例：333

第1区：

• 身份证号码：吉尔
• 主题：999

第2区：

• ID:OPE
• 主题：778

非常感谢您的帮助。

在

$内部。each（）

，您需要通过

myData

数组而不是

myData.blockOne

，因为

myData.blockOne

只返回

blockOne

对象的数据

var myData=[{
“项目名称”：{
“id”：“XYZ”，
“案件编号”：“123”
},
“第一区”：[{
“id”：“ABC”，
“主题”：“321”，
}],
“第二区”：[{
“id”：“EFG”，
“主题”：“456”，
}]
},
{
“项目名称”：{
“id”：“你好”，
“案件编号”：“333”
},
“第一区”：[{
“id”：“JIL”，
“主题”：“999”，
}],
“第二区”：[{
“id”：“OPE”，
“主题”：“778”，
}]
},
];
var html=“”；
$.each（myData，function（）{
html+=`
项目

ID:${this.ItemName.ID}

案例：+${this.ItemName.caseNumber}

第1区：


ID:${this.blockOne[0].ID}
主题：${this.blockOne[0].Subject}

第2区：


ID:${this.blockTwo[0].ID}
主题：${this.blockTwo[0].Subject}

`
});
$（'#myData'）.html（html）

在

$内部。each（）

，您需要在

myData

数组中循环，而不是

myData.blockOne

，因为

myData.blockOne

只返回

blockOne

对象的数据

var myData=[{
“项目名称”：{
“id”：“XYZ”，
“案件编号”：“123”
},
“第一区”：[{
“id”：“ABC”，
“主题”：“321”，
}],
“第二区”：[{
“id”：“EFG”，
“主题”：“456”，
}]
},
{
“项目名称”：{
“id”：“你好”，
“案件编号”：“333”
},
“第一区”：[{
“id”：“JIL”，
“主题”：“999”，
}],
“第二区”：[{
“id”：“OPE”，
“主题”：“778”，
}]
},
];
var html=“”；
$.each（myData，function（）{
html+=`
项目

ID:${this.ItemName.ID}

案例：+${this.ItemName.caseNumber}

第1区：


ID:${this.blockOne[0].ID}
主题：${this.blockOne[0].Subject}

第2区：


ID:${this.blockTwo[0].ID}
主题：${this.blockTwo[0].Subject}

`
});
$（'#myData'）.html（html）

ajax请求已经在解析从json到对象/数组的响应。这是因为您有

数据类型：“json”

，它告诉ajax您希望返回json，所以它会自动为您解析它。然后获取已解析的对象并将其附加到段落字符串中。如果您希望它仍然是字符串，则需要将

数据类型

声明更改为

文本

。仅供参考：数据的外部容器似乎是一个数组，您正试图从中访问“blockOne”属性。我想您需要

$。each（myData

，而不是

$。each（myData.blockOne

我认为@CharlesBamford有点问题，但我不确定我的代码中应该做什么更改。ajax请求已经在解析json到对象/数组的响应。这是因为您有

数据类型：'json'

，它告诉ajax您希望返回json，所以它会自动解析它。然后，您将已解析的对象，并将其附加到段落字符串。如果您希望它仍然是字符串，则需要将

数据类型

声明更改为

文本

。仅供参考：数据的外部容器似乎是一个数组，您正试图访问“blockOne”属性。我认为您需要

$。each（myData

，而不是

$。each（myData.blockOne

我认为@CharlesBamford了解一些东西，但我不确定我的代码中要更改什么。这很接近，但它只显示了第一个实例。即使使用您的示例，我也将它放在JSFIDLE中→ 你所说的实例是什么意思？数组中有多个元素吗？是的，即使在你发布的示例中也有两个“ItemName”块。你的代码只显示了一个。很抱歉。我更新了我的代码。请检查这是否接近，但它只显示了第一个实例。即使使用了你的示例，我也将其放在了JSFIDLE中→ 你所说的实例是什么意思？数组中有多个元素吗？是的，即使在你发布的示例中也有两个“ItemName”块。你的代码只显示一个。很抱歉。我更新了我的代码。请检查

[
    {
        "ItemName": {
            "id": "XYZ",
            "caseNumber": "123"
        },
        "blockOne": [
            {
                "id": "ABC",
                "subject": "321",
            }
        ],
        "blockTwo": [
            {
                "id": "EFG",
                "subject": "456",
            }
        ]
    },
    {
        "ItemName": {
            "id": "HIJ",
            "caseNumber": "333"
        },
        "blockOne": [
            {
                "id": "JIL",
                "subject": "999",
            }
        ],
        "blockTwo": [
            {
                "id": "OPE",
                "subject": "778",
            }
        ]
    },
]