我正在学习建立一个光伏电站监测网站。我的硬件每10秒向SQL服务器提供数据。现在，我必须以每10秒刷新一次值的仪表形式表示这些记录的数据。但问题是，我不能让我的值被当前时间刷新。

我使用mysql查询CURTIME()来匹配计算机时间。但是当我重新应用查询时，CURTIME()没有刷新到实际当前时间。当我加载页面时，它坚持CURTIME()的最后读数。所以，CURTIME()只有在我重新加载页面后才刷新。

我的问题是，如何在mysql查询中刷新CURTIME()的值而不需要重新加载页面?这是我的脚本供参考:

<script>
  var g1, g2, g3, g4, g5, g6;
  var pvvol  = <?php include 'pvvol.php';?>;
  var pvcur  = <?php include 'pvcur.php';?>;
  var batvol = <?php include 'batvol.php';?>;
  var batcur = <?php include 'batcur.php';?>;
  var chgcur = <?php include 'chgcur.php';?>;
  var irrad  = <?php include 'irrad.php';?>;
  window.onload = function(){
    var g1 = new JustGage({
      id: "g1", 
      value: pvvol, 
      min: 0,
      max: 80,
      title: "PV Voltage",
      label: "Volt"
    });
    var g2 = new JustGage({
      id: "g2", 
      value: pvcur, 
      min: 0,
      max: 30,
      title: "PV Current",
      label: "Ampere"
    });
    var g3 = new JustGage({
      id: "g3", 
      value: chgcur, 
      min: 0,
      max: 80,
      title: "Charge Current",
      label: "Ampere"
    });
    var g4 = new JustGage({
      id: "g4", 
      value: batvol, 
      min: 0,
      max: 30,
      title: "Battery Voltage",
      label: "Volt"
    });
    var g5 = new JustGage({
      id: "g5", 
      value: batcur, 
      min: -50,
      max: 50,
      title: "Battery Current",
      label: "Ampere"
    });
    var g6 = new JustGage({
      id: "g6", 
      value: irrad, 
      min: 0,
      max: 1200,
      title: "Irradiance",
      label: "Watt / Sqm"
    });
    setInterval(function() {
      g1.refresh(pvvol);
      g2.refresh(pvcur);          
      g3.refresh(chgcur);
      g4.refresh(batvol);
      g5.refresh(batcur);
      g6.refresh(irrad);
    }, 2500);
  };
</script>

调用数据库的PHP代码将只运行一次(每次请求/刷新页面时)。这意味着数据库中的数据将永远不会更新，即使JavaScript更新代码每2.5秒运行一次。

您需要使用AJAX调用从数据库中获取最新的信息。JavaScript/jQuery代码对PHP文件进行AJAX调用，该文件从数据库返回最新信息。这些信息然后由JS/jQuery处理，g1到g6可以用新数据刷新。

AJAX代码示例

PHP代码:getGaugeData.php

该文件由AJAX请求调用。它的工作是从数据库中获取数据，并以简单的JSON格式返回给JavaScript代码。

注意: 我假设每个包含的PHP文件现在都创建PHP变量(pvvol, pvcur, batvol, batcur, chgcur, irrad)并为它们分配值。

<?php
    /*
     * This PHP resource is only called via AJAX - it returns data in JSON format!
     */
    //Include PHP files that get the data
    //Each include file should define a PHP variable with the same name as the file: pvvol, pvcur, batvol, batcur, chgcur, irrad
    include 'pvvol.php';
    include 'pvcur.php';
    include 'batvol.php';
    include 'batcur.php';
    include 'chgcur.php';
    include 'irrad.php';
    //Create associative array of the data
    $data = array(
        'pvvol' => $pvvol,
        'pvcur' => $pvcur,
        'batvol' => $batvol,
        'batcur' => $batcur,
        'chgcur' => $chgcur,
        'irrad' => $irrad
    );
    //Convert the data into a JSON format string
    $output = json_encode($data);
    //Return the JSON data to the JS code
    echo $output;
    exit;
?>

JavaScript代码

setInterval(function() {
    //Set up AJAX call to getGaugeData.php
    $.getJSON('getGaugeData.php').done(function(data) {
        //Use the AJAX data to refresh the gauges
        g1.refresh(data.pvvol);
        g2.refresh(data.pvcur);
        g3.refresh(data.chgcur);
        g4.refresh(data.batvol);
        g5.refresh(data.batcur);
        g6.refresh(data.irrad);
    });
}, 2500);

如果你想从服务器获得新的数据而不重新加载页面，我建议你看看ajax。

ajax用于从javascript调用服务器

刷新JQuery Script中的CURTIME()值

Refresh CURTIME() value in JQuery Script

AJAX代码示例