【问题标题】:Parse Json data in Jquery在 Jquery 中解析 Json 数据
【发布时间】:2015-01-09 02:46:24
【问题描述】:

我是 Jquery、Ajax 和 JSON 的新手。 我面临解析 Json 数据的问题。 我在stackoverflow上遇到了很多问题

Parsing JSON objects for HTML table

Access / process (nested) objects, arrays or JSON

Parse JSON in JavaScript?

How could I parse through this JSON object in JQuery?

还有更多...

我仍然无法解析 Json 数据。

我的 Jquery 看起来像:

$.ajax({
  /* type : "POST", */
  url : "launchapptest",
  /* contentType: "application/json; charset=utf-8", */
  data : "processDateInput="+processDate,
  dataType : "json",
  async: true,
  success : function(result) {
    var od = JSON.stringify(result) ;
    var obj = JSON.parse(od);

    console.log(obj.od);
    console.log(obj.od.percentageCompleted);

    console.log(od);
    $.each(JSON.parse(od), function(idx, obj) {
      console.log(obj.tagName);
    });         
  }
});

我已经尝试了所有的组合来解析这个数据,但是 js 控制台打印为“未定义”

我可以将 json 对象打印为:

{
  "od": [
    {
      "dateProcessed": [
        "09/11/2014",
        "10/11/2014",
        "11/11/2014",
        "12/11/2014"
      ],
      "percentageCompleted": 25,
      "processRunning": 0,
      "remainingTime": 0,
      "successBatchCount": 0,
      "totalBatchCount": 0
    }
  ],
  "processDateInput": "12/11/2014"
}

请帮助我如何获取 dateProcessed 数组和完成百分比。

【问题讨论】:

  • 当我尝试每个循环时,即使只有 onw 记录,lop 也会运行两次...请帮助

标签: javascript jquery ajax json parsing


【解决方案1】:

试试这个代码。

$.ajax({
    /* type : "POST", */
    url: "launchapptest",
    /* contentType: "application/json; charset=utf-8", */
    data: "processDateInput=" + processDate,
    dataType: "json",
    async: true,
    success: function (result) {
        var od = JSON.stringify(result);
        var obj = JSON.parse(od);

        $.each(obj, function (index, value) {
            console.log(obj[index][0].percentageCompleted);
            console.log(obj[index][0].processRunning);
            console.log(obj[index][0].remainingTime);
            console.log(obj[index][0].successBatchCount);
            console.log(obj[index][0].totalBatchCount);
            console.log(obj.processDateInput);
            $.each(obj[index][0].dateProcessed, function (ind, val) {
                console.log(val);
            })
        });

    }
});

【讨论】:

  • 控制台输出.... 25 Dashboard.jsp:127 0 Dashboard.jsp:128 0 Dashboard.jsp:129 0 Dashboard.jsp:130 0 Dashboard.jsp:131 12/11/2014 仪表板.jsp:132 09/11/2014 Dashboard.jsp:134 10/11/2014 Dashboard.jsp:134 11/11/2014 Dashboard.jsp:134 12/11/2014 Dashboard.jsp:134 null Dashboard.jsp:134 null Dashboard.jsp:134 null Dashboard.jsp:134 null Dashboard.jsp:134 null Dashboard.jsp:134 undefined Dashboard.jsp:127 undefined Dashboard.jsp:128 undefined Dashboard.jsp:129 undefined Dashboard.jsp:130 undefined Dashboard .jsp:130
【解决方案2】:

不需要解析它,因为你已经提到它是 json 你可以简单地这样做:

                 success: function(result) {
    console.log(result.od);
    console.log(result.od[0].percentageCompleted);
console.log(od);
    $.each(result, function(idx, obj) {
     console.log(obj[0].dateProcessed);
    });         
}

【讨论】:

    【解决方案3】:

    你的 AJAX 调用的返回数据是什么

    原来是这样的

    {
        "od": [
            {
                "dateProcessed": [
                    "09/11/2014",
                    "09/12/2014"
                ],
                "percentageCompleted": 25,
                "processRunning": 0,
                "successBatchCount": 0,
                "totalBatchCount": 0
            }
        ],
        "processDateInput": "12/11/2014"
    }
    

    你可以这样解析

    var json = JSON.parse(result);
                var od = json['od'];
                var processDateInput = json['processDateInput'];
    
                $.each(od, function(index, value){
                    console.log(value, index);
                });
    

    希望它对你有用。

    【讨论】:

      【解决方案4】:

      当您将dataType 指定为 JSON 时,jQuery 会自动为您解析它。按原样再次解析(甚至多次)会导致问题。试试这个:

      success: function(result) {
          console.log(result.od);
          console.log(result.od[0].percentageCompleted);
      }
      

      我不完全确定您的 $.each 循环试图做什么,因为您的对象中没有 tagName 属性。

      【讨论】:

        猜你喜欢
        • 2010-10-02
        • 2016-03-19
        • 1970-01-01
        • 1970-01-01
        • 2011-06-03
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多