php - 来自 mysql 服务器的 ajax.reload 出现错误 : property is undefined

Question

我正在使用 php 和 ajax 从 mysql 数据库收集实时数据。我希望数据每 2 秒实时更新一次。

我的代码根据需要显示图表和数据，但不会实时更新数据库中的数据。要做这件事的代码是:

setInterval(function(){
            jsonData.ajax.reload();
            }, 2000);

我认为错误就在那里，当我用谷歌浏览器检查元素时，它告诉我“未捕获的类型错误:无法读取未定义的属性‘重新加载’”。

完整的 JS 代码如下:

<script type="text/javascript">

      // load chart lib
      google.load('visualization', '1', {
        packages: ['corechart']
      });

      // call drawChart once google charts is loaded
      google.setOnLoadCallback(drawChart);

function drawChart() {
     var jsonData = $.ajax({
         url: "php/connection3_temp.php",
         dataType:"json",
         async: true
          }).done(function (results) {

          var data = new google.visualization.DataTable();

          data.addColumn('datetime', 'Time');
          data.addColumn('number', 'Ambient Temp.');
          data.addColumn('number', 'Object Temp.');
          data.addColumn('number', 'Humidity');

          $.each(results, function (i, row) {
            data.addRow([
              (new Date(row.timestamp)),
              parseFloat(row.amb_temp),
              parseFloat(row.obj_temp),
              parseFloat(row.hum)
            ]);
          });

         var options = {
          title: 'Temperature and Humidity against Time',
          legend: { position: 'bottom' },
          series: {
                0: {targetAxisIndex: 0},
                1: {targetAxisIndex: 0},
                2: {targetAxisIndex: 1}
          },
          vAxes: {0:    {title: 'Temp. (°C)',
                        minValue: 0,
                        maxValue: 30
                        },
                  1:    {title: 'Humidity (%)',
                        minValue: 20,
                        maxValue: 80
                        }
                 },
          hAxis: {
                  title: 'Time (s)'
                 },
        };

          var chart = new google.visualization.LineChart($('#temp_chart').get(0)); 
          chart.draw(data, options);

        });

        setInterval(function(){
        jsonData.ajax.reload();
        }, 2000);

      }

</script>

还有 PHP:

<?php

$servername = "localhost";
$username = "root";
$password = "raspberryblue";
$dbname = "test";

// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
    die("Connection failed: " . $conn->connect_error);
} 

$sql = "SELECT * FROM sensortag3 ORDER BY id DESC LIMIT 3000";
$result = $conn->query($sql);

// All good?
if ( !$result ) {
  // Nope
  $message  = 'Invalid query: ' . mysqli_error() . "<br>";
  $message .= 'Whole query: ' . $sql;
  die( $message );
}

// Print out rows
$prefix = '';
echo "[\n";
while ( $row = mysqli_fetch_assoc( $result ) ) {
  echo $prefix . " {\n";
  echo '  "timestamp": "' . $row['timestamp'] . '",' . "\n";
  echo '  "amb_temp": "' . $row['amb_temp'] . '",' . "\n";
  echo '  "obj_temp": "' . $row['obj_temp'] . '",' . "\n";
  echo '  "hum": "' . $row['hum'] . '"' . "\n"; 
  echo " }";
  $prefix = ",\n";
}
echo "\n]";

$conn->close();
?>

Answer 1

您的脚本中没有名为 reload() 的属性。这就是控制台显示未定义属性 reload() 的原因。所以在ajax()中添加reload方法来刷新数据。