是否允许在 jQuery Ajax 中混合使用 POST/JSON 数据？答案

【问题标题】：Is allowed a mixture of POST/JSON data in jQuery Ajax?是否允许在 jQuery Ajax 中混合使用 POST/JSON 数据？
【发布时间】：2016-05-24 06:32:52
【问题描述】：

我有以下代码，其中通过 jQuery AJAX 方法对服务器进行客户端调用。结果由服务器以 JSON 格式重新存储。一切正常，但我发现解析数据所需的“替换”有点麻烦和奇怪，如果我不抑制“[”和“]”字符，代码根本不起作用。有什么可以改进的建议吗？

客户端代码：

    jQuery.ajax({
    type: 'POST',
    url: 'ajax/cart_update.php?lang=en',
    data: { 
        'id': id ,
        'incr' : increment,
        'quantity' : jQuery("#quantity_number" + id).val(), 
        'final_quantity' : final_quantity,
    },
    success: function(data){
        var data = data.replace("[", "");
        data = data.replace("]", "");
        if(data != ""){
            var obj = jQuery.parseJSON(data);
            jQuery("#quantity_number" + id).val(obj.quantity);
            jQuery("#total" + id).html(obj.price);
        } // if
    }
});

服务器（PHP）代码：

 ... some SQL query...

 $value[0]["quantity"] = $row->quantity;
 $value[0]["price"] = get_price_product($row->id_product, $row->quantity);

 echo json_encode($value);

输出为字符串：[{"quantity": "8", "price": "$1,756.00"}]

为什么我需要抑制“[”和“]”字符？

【问题讨论】：

标签： jquery json ajax post

【解决方案1】：

实际上，您正试图从您的 json 响应中取出一个对象。使用 jquery 中的 $.each() 和带有普通 js 的 for..in 等迭代器很容易做到这一点：

您可以将其与 $.each() 之类的迭代器一起使用：

jQuery.ajax({
  type: 'POST',
  url: 'ajax/cart_update.php?lang=en',
  //datatype: 'json', // <----add this, this can parse the response as json.
  data: {
    'id': id,
    'incr': increment,
    'quantity': jQuery("#quantity_number" + id).val(),
    'final_quantity': final_quantity,
  },
  success: function(data) {
    if (data != "") {
      var resp = jQuery.parseJSON(data); // You don't have datatype, so this is required.
      jQuery.each(resp, function(i, obj) {
        jQuery("#quantity_number" + id).val(obj.quantity);
        jQuery("#total" + id).html(obj.price);
      });
    } // if
  }
});

如果您在 ajax 选项中添加 datatype: 'json'，那么您不必将 json 字符串解析为有效的 json。 datatype 自动执行此操作，您不必按照您的方式明确执行此操作。

【讨论】：

像魅力一样工作，谢谢。我忘记了我正在发回一个数组，因为它本身就是要进行 json 化的源。感谢所有其他贡献者的回复。

【解决方案2】：

如果你不抑制“[”和“]”字符并解析响应json，它将是一个对象数组。您需要遍历此数组，并且在循环内您可以访问每个对象的属性。您当前的代码现在可以工作，因为很可能您的数组中只有一项。但是如果你会得到多个项目，你当前的代码也会中断。

【讨论】：

【解决方案3】：

服务器向您发送了 JSON 对象列表，因此您需要删除 '[' 和 ']'。直接解析你的数据和用户数组对象进行迭代

下面的例子可以帮助你

var data='[{"cantidad": "8", "precio": "$1,756.00"},{"sadsad": "8", "precio": "$1,756.00"}]';

    var objs = jQuery.parseJSON(data); //this is an array of objects
    console.log(objs) //objs[0].cantidad,objs[0].precio

【讨论】：

【解决方案4】：

您不需要使用替换功能。只需解析返回的字符串。使用下面的代码

jQuery.ajax({
type: 'POST',
url: 'ajax/cart_update.php?lang=en',
data: { 
    'id': id ,
    'incr' : increment,
    'quantity' : jQuery("#quantity_number" + id).val(), 
    'final_quantity' : final_quantity,
},
success: function(data){
    if(data != ""){
        var obj = JSON.parse(data);
        jQuery("#quantity_number" + id).val(obj[0].quantity);
        jQuery("#total" + id).html(obj[0].price);
    } // if
  }
});

【讨论】：

【解决方案5】：

您可以循环数组并获取结果。

var obj = jQuery.parseJSON(data);
$.each(obj, function(index, value) {
  $("#quantity_number" + id).val(value.quantity);
  $("#total" + id).html(value.price);
});

【讨论】：

请添加一些解释！ :)