刷新 PHP 数据在主页上返回 NaN - Refresh PHP data return NaN on main page

我真的很想在我的网页上显示仪表，它使用MySQL数据库中的新数据进行自我更新。我有几个文件可以让它工作，但它不起作用。第一个文件称为data.php它包含（对不起，荷兰语评论）：

    <?php
    // Datum aanmaken om bovenaan de pagina te zetten
    date_default_timezone_set('Europe/Amsterdam');
    $vandaagtijd = date("d-m-Y, H:i");
    include_once "/externalpw/mysql_pw.php";
    $link = mysql_pconnect($MyHostname, $MyUsername, $MyPassword) or die("Error verbinden met DB: " . mysql_error());

    //Eerst de elektra en het gas selecteren in die database en dan daarmee aan de gang
    $db = mysql_select_db("elekgas", $link);
    if (!$db) {
            mysql_close($link);
            die("Error selecteren DB: " . mysql_error());
    }
    // Actuele waaarden op van huidig verbruik en meterstanden
    $result1 = mysql_query("SELECT gebr_laag_tarief AS glt, gebr_hoog_tarief AS ght, leve_laag_tarief AS llt, leve_hoog_tarief AS lht, huidig_verbruik AS hv, huidig_levering AS hl, gas FROM meetwaarden ORDER BY id DESC LIMIT 1");
    if (!$result1) {
            mysql_close($link);
            die("Error met query1: " . mysql_error());
    }
while ($row = mysql_fetch_assoc($result1)) {
        $data[] = $row;
}
?>
var jsonarray = <?php echo json_encode($data); ?>;

在第二个文件，我的主文件中，我有这个部分来刷新 php 输出：

    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$.ajaxSetup({ cache: false });
$.post('index4.php'), function(data){
$(data.result).each(function(i, item){
$.append("<?= $" + item.key + " = " + item.value + "; ?>");
});
}, "jsonp");
});
</script>

我要刷新的div 基本上什么都不包含。我只想为仪表返回一个新值。仪表本身将使用间隔函数进行自我更新。为清楚起见，该仪表代码如下。但是，会发生什么，它会返回 NaN（不是数字）。我觉得需要在这里暗示一些JSON_encode才能让它一切正常，但我不知道如何让它继续下去。

在数据中.php echo JSON_encode($result1);似乎是一个好的开始，但是如何在主文件中将其取出呢？显然，负载（'数据.php'）不是这里的方式......

<canvas id="gauge2"
     width="200" height="200"
     data-type="canv-gauge"
     data-title="Vermogen"
     data-min-value="0"
     data-max-value="400"
     data-major-ticks="0 100 200 300 400"
     data-minor-ticks="5"
     data-stroke-ticks="true"
     data-units="kWh"
     data-value-format="3.2"
     data-glow="true"
     data-animation-delay= false
     data-animation-duration=
     data-animation-fn=
     data-colors-needle="#dd0000 #0000ff"
     data-highlights="0 100 #a9feff, 100 300 #bbffaa, 300 400 #ffffaa"
     data-onready="setInterval( function() { Gauge.Collection.get('gauge2').setValue(<?= $hl; ?>);}, 5000);">
    </canvas>

我知道这些问题已经多次出现，但就AJAX和JSON而言，我并不是真正的明星。因此，感谢所有帮助！谢谢。

你应该在JS中使用jQuery的post，在PHP中使用json_encode。

一旦你有一个复杂的JSON对象，阅读访问/处理（嵌套）对象，数组或JSON以了解如何访问其项目，然后尝试我为你编写的这个JSFiddle示例，它从iTunes的公共API获取歌曲列表并将它们放在一个表中。

为了方便起见，我在这里发布了我的解决方案。

PHP 文件：

while ($row = mysql_fetch_array($result1)) {
        $data = $row;
}
//echo json_encode($data, JSON_NUMERIC_CHECK);
array_push($json, $data);
echo json_encode($json);
?>

JS部分：

<script type="text/javascript">
var glt;
var ght;
var llt;
var lht;
var hv;
var hl;
var gas;
$(document).ready(function() {
$.ajax({
        type: "POST",
        url: "data.php",
        dataType: "JSON",
        success: function(data){
        glt = data[0].glt;
        ght = data[0].ght;
        llt = data[0].llt;
        lht = data[0].lht;
        hv  = data[0].hv;
        hl  = data[0].hl;
        gas = data[0].gas;
}
});
});
</script>

仪表部分只是使用我想要显示的正确变量。

非常感谢阿莱西奥·坎塔雷拉的帮助。最后，他确实为我指出了正确的方向:)