Question

我在刷新MySQL结果显示在页脚中的间隔上刷新页脚div时遇到问题

我目前有一个页面，该页面显示一个100框的表，该表在页面加载时加载，并在间隔时刷新。我试图为页脚实施相同类型的方法，但会收到意外的令牌错误<< / p>

当前用于刷新表格的代码是

        function updateTable() {
        //console.log('function called');
        $('td.coloured').css('background-color','#8F8F8F').toggleClass('coloured');
        $.get('php/mysql.php', function(response) {
            response.forEach(function(item, index) {
                console.log(item.beacon);
                //$('td.coloured').css('background-color','#8F8F8F').toggleClass('coloured');
        $(`td.${item.beacon}`).css('background-color', item.location).toggleClass('coloured');
            });
        });

    }
    var updateTableInterval = setInterval(updateTable, 5000);
});


<script>
function updateFooter() {
<div id="footer">

<div class="box"><h6 align="center">Total count<h6>
<?php           
$connect = mysqli_connect("localhost", "user", "password", "test");  
$query = "SELECT count(value1) FROM table WHERE date = CURDATE()";  
$result = mysqli_query($connect, $query); 
while($row = mysqli_fetch_array($result)) {  
echo "".$row['count(value1)'].""; 
}  
?></div>
<div class="box2"><h6 align="center">Total count<h6>
<?php           
$connect = mysqli_connect("localhost", "user", "password", "test");  
$query = "SELECT count(value2) FROM table WHERE date = CURDATE()";  
$result = mysqli_query($connect, $query); 
while($row = mysqli_fetch_array($result)) {  
echo "".$row['count(value2)'].""; 
}  
?></div>
<div class="box3"><h6 align="center">Total count<h6>
<?php           
$connect = mysqli_connect("localhost", "user", "password", "test");  
$query = "SELECT count(value3) FROM table WHERE date = CURDATE()";  
$result = mysqli_query($connect, $query); 
while($row = mysqli_fetch_array($result)) {  
echo "".$row['count(value3)'].""; 
}  
?></div>
<div class="box4"><h6 align="center">Total count<h6>
<?php           
$connect = mysqli_connect("localhost", "user", "password", "test");  
$query = "SELECT count(value4) FROM table WHERE date = CURDATE()";  
$result = mysqli_query($connect, $query); 
while($row = mysqli_fetch_array($result)) {  
echo "".$row['count(value4)'].""; 
}  
?></div>
</div>
            });
    }
    var updateFooterInterval = setInterval(updateFooter, 5000);
});
</script>

Answer 1

使用Pure JavaScript，您无法将HTML和JS混合使用（无论如何，React可以做到这一点，但它是RJX）。简单来说，为页脚创建一个单独的PHP文件，例如footer.php，然后在其中添加要更新的代码：

<?php           
$connect = mysqli_connect("localhost", "user", "password", "test");  
$query = "SELECT count(value) FROM table WHERE date = CURDATE()";  
$result = mysqli_query($connect, $query); 
while($row = mysqli_fetch_array($result)) {  
  echo "".$row['count(value)'].""; 
}  
?>

然后在前端使用AJAX（最好是（$.load）进行更新：

<div id="footer">
  <div class="box">
    <h6 align="center">Total count<h6>
    <div class="footer-contents"></div>
  </div>
</div>

使用以上方法，使用：

$(".footer-contents").load("footer.php");
setInterval(function () {
  $(".footer-contents").load("footer.php");
}, 5000);

以上内容将以5秒的间隔更新页脚。

最好将document的ready函数包装起来，并添加#footer以获得更多的特异性：

$(function () {
  $("#footer .footer-contents").load("footer.php");
  setInterval(function () {
    $("#footer .footer-contents").load("footer.php");
  }, 5000);
});

更新：

此内容位于footer.php中：

<div id="footer">
  <div class="box">
    <h6 align="center">Total count<h6>
<?php
$connect = mysqli_connect("localhost", "user", "password", "test");  
$query = "SELECT count(value1) FROM table WHERE date = CURDATE()";  
$result = mysqli_query($connect, $query); 
while($row = mysqli_fetch_array($result)) {  
  echo "".$row['count(value1)'].""; 
}  
?>
  </div>
  <div class="box2">
    <h6 align="center">Total count<h6>
<?php
$connect = mysqli_connect("localhost", "user", "password", "test");  
$query = "SELECT count(value2) FROM table WHERE date = CURDATE()";  
$result = mysqli_query($connect, $query); 
while($row = mysqli_fetch_array($result)) {  
  echo "".$row['count(value2)'].""; 
}  
?>
  </div>
  <div class="box3">
    <h6 align="center">Total count<h6>
<?php
$connect = mysqli_connect("localhost", "user", "password", "test");  
$query = "SELECT count(value3) FROM table WHERE date = CURDATE()";  
$result = mysqli_query($connect, $query); 
while($row = mysqli_fetch_array($result)) {  
  echo "".$row['count(value3)'].""; 
}  
?>
  </div>
  <div class="box4">
    <h6 align="center">Total count<h6>
<?php
$connect = mysqli_connect("localhost", "user", "password", "test");  
$query = "SELECT count(value4) FROM table WHERE date = CURDATE()";  
$result = mysqli_query($connect, $query); 
while($row = mysqli_fetch_array($result)) {  
  echo "".$row['count(value4)'].""; 
}  
?>
  </div>
</div>

您不需要上面的代码中的其他任何内容。

间隔刷新页脚DIV

1 个答案: