Question

我有一个发送和检索字符串的Ajax函数。一旦Ajax收到字符串，它就会调用一个名为drawChart的函数。 drawChart然后使用JSON.parse将该字符串转换为数组我还使用Google Charts使用传入的数据创建图表。一切正常。图表正在制作中，看起来很好;我在控制台中收到此错误：

Uncaught（在promise中）SyntaxError：JSON中的意外标记u 位置0 在JSON.parse（）在drawChart（index.js？c1496931740：24）在匿名

我研究了这个错误，当JSON.parse中传递的数据类型未定义时，就会发生这种错误。我尝试使用console.log(typeof(data))来检查它是否确实是未定义的，但它输出了2个东西。首先它输出字符串，然后输出undefined。之后，它会显示错误，但图表会成功显示。这是我的代码：

function aggregator(field, size) {
    /*Build jSON query string*/
    var jString = '{"aggs": { "group_by_date": { "terms": { "field": "' + field + '", "size" : ' + size + '} } } }';

    google.charts.setOnLoadCallback(drawChart);   /*Load Chart*/

    /*Sending and retrieving data using Ajax*/
    $.ajax({
        url: 'index.php',
        type: 'post',
        datatype: 'json',
        data: {
            qSet: jString,
            size: size
        },
        success: drawChart
    });
}

var drawChart = function(data)
{   
    console.log(typeof(data));
    data = JSON.parse(data);  /*Convert the data back into an array*/

    var chartData = new google.visualization.DataTable();  /*Set up the chart*/

    chartData.addColumn('string', 'year'); 
    chartData.addColumn('number', 'Records');

    /*For loop to add rows*/
    for (var i = 0; i < data.length; ++i){
        chartData.addRow(data[i]);
    }

    var options = {
        title: 'Arrival Data'
    };

    var chart = new google.visualization.BarChart(document.getElementById('chartContainer'));
    chart.draw(chartData, options);
};

出现此错误的原因是什么？当我执行console.log（typeof（data））时，为什么我会收到2个输出（字符串然后未定义）？我该如何解决？

Answer 1

当我执行console.log（typeof（data））时，为什么会收到2个输出（字符串然后未定义）？

因为您正在调用该函数两次。

google.charts.setOnLoadCallback(drawChart);
success: drawChart

只有在获得数据时才会调用它。

google.charts.setOnLoadCallback允许您指定在API可用时运行的函数。

创建一个新函数，该函数发出Ajax请求，并在API加载时调用它。

google.charts.setOnLoadCallback(sendAjaxRequest); /*Load Chart*/

function sendAjaxRequest() {

  $.ajax({
    url: 'index.php',
    type: 'post',
    datatype: 'json',
    data: {
      qSet: jString,
      size: size
    },
    success: drawChart
  });
}

JSON

1 个答案: