Javascript 使用AJAX将JSON结果作为JS数组返回？

提前道歉-我是新手，所以其他答案都帮不了我

我使用AJAX将数据发送到PHP脚本（第三方API的一部分）。PHP脚本将结果返回为JSON，但我不知道如何在HTML页面上格式化这些结果

最后，我希望将JSON结果保存为一个数组，然后使用JS/Jquery在页面上格式化它们

我不知道如何修改PHP和AJAX脚本来实现这一点。谁能给我指出正确的方向吗

我的AJAX：

$.ajax({
            type: 'POST',
            url: 'calculator.php',
            data: {toPostcode: toPostcodeValue, parcelLengthInCMs: parcelLengthInCMsValue, parcelHeighthInCMs: parcelHeighthInCMsValue, parcelWidthInCMs: parcelWidthInCMsValue, parcelWeightInKGs: parcelWeightInKGsValue},
            success: function(data) {
                <!--NOT SURE WHAT TO PUT HERE-->
            }
})

预期的JSON结果应该如下所示：

{
  "services": {
    "service" : [
      {
        "code": "AUS_PARCEL_REGULAR",
        "name": "Parcel Post (your own packaging)",
        "speed": 2,
        "price": 6.95,
        "max_extra_cover": 5000,
        "extra_cover_rule": "100,1.5,1.5",
        "icon_url": "http://test-static.npe.auspost.com.au/api/images/pac/regular_post_box.png",
        "description": "Based on the size and weight you've entered",
        "details": "Check our ",
        "delivery_time": "Delivered in up to 3 business days",
        "ui_display_order": 1,
        "options": {
          "option": [
            {
              "code": "AUS_SERVICE_OPTION_STANDARD",
              "name": "Standard Service",
              "price": "0.00",
              "price_type": "static",
              "option_type": "optional",
              "ui_display_order": 1
            },
            {
              "code": "AUS_SERVICE_OPTION_SIGNATURE_ON_DELIVERY",
              "name": "Signature on Delivery",
              "price": 2.95,
              "price_type": "static",
              "option_type": "optional",
              "tooltip": "Signature on Delivery provides you with the peace of mind that your item has been delivered and signed for.",
              "ui_display_order": 2,
              "suboptions": {
                "option": {
                  "code": "AUS_SERVICE_OPTION_EXTRA_COVER",
                  "name": "Extra Cover",
                  "option_type": "optional",
                  "price_type": "dynamic",
                  "tooltip": "Extra Cover provides cover for loss, damage or theft of your item and will fully compensate you to the value specified for your item.",
                  "ui_display_order": 1
                }
              }
            }
          ]
        }
      },

---

如果返回数据是JSON，可以做两件事，在AJAX调用中使用

dataType:“JSON”

编辑1

如果您使用的是

数据类型：“json”

。如果您确定返回的数据是JSON字符串，那么哪个更可取data变量将直接为您提供JSON对象。我认为您可以像访问

数据['services']

一样访问它

success: function (data) {
    jsonObj = $.parseJSON(data);
    //this gives you the inner onject of the return data
    servicesObj = jsonObj.services; 
}

---

或者您可以只获取数据，然后使用将数据字符串解析为JSON对象

$.ajax({
    type: 'POST',
    url: 'calculator.php',
    data: {
        toPostcode: toPostcodeValue,
        parcelLengthInCMs: parcelLengthInCMsValue,
        parcelHeighthInCMs: parcelHeighthInCMsValue,
        parcelWidthInCMs: parcelWidthInCMsValue,
        parcelWeightInKGs: parcelWeightInKGsValue
    },
    success: function (data) {
        jsonObj = $.parseJSON(data);
        //this gives you the inner onject of the return data
        servicesObj = jsonObj.services; //or jsonObj["services"]
    }
})

---

如果正在使用，则永远不会调用success函数 echo json_encode（）；在php脚本中。

---

您应该在type:'POST'之后添加dataType:'json'，然后您的success函数将被调用，并将在data

console.log（data）中获得服务器返回的结果您是否获得所需的JSON？如果是，那么您可以使用jquery简单地呈现数据，或者您可以使用一些模板机制。
dataType
与
type
相同吗？我认为“sending”类型必须保持与PHP脚本使用的POST相同$_POST@MeltingDog
数据
和
数据类型
是不同的<代码>数据类型（默认值：智能猜测（xml、json、脚本或html）），在
$中。AJAX
是您希望从服务器获得的数据类型。与传递的
数据的类型无关。
$.ajax({
    type: 'POST',
    url: 'calculator.php',
    data: {
        toPostcode: toPostcodeValue,
        parcelLengthInCMs: parcelLengthInCMsValue,
        parcelHeighthInCMs: parcelHeighthInCMsValue,
        parcelWidthInCMs: parcelWidthInCMsValue,
        parcelWeightInKGs: parcelWeightInKGsValue
    },
    success: function (data) {
        jsonObj = $.parseJSON(data);
        //this gives you the inner onject of the return data
        servicesObj = jsonObj.services; //or jsonObj["services"]
    }
})