如何运行一个60秒倒计时计时器或打开一个countdown.php时，新的数据插入数据库，我使用的是真实的数据显示？

kknvjkwl 于 2023-08-02 发布在 PHP

关注(0)|答案(1)|浏览(121)

Countdown. php//我从互联网上的某个地方得到它

<script>
function countDown(secs,elem) {
    var element = document.getElementById(elem);
    element.innerHTML = "Please wait for "+secs+" seconds";
    if(secs < 1) {
        clearTimeout(timer);
        element.innerHTML = '<h2>Countdown Complete!</h2>';
        element.innerHTML += '<a href="#">Click here now</a>';
    }
    secs--;
    var timer = setTimeout('countDown('+secs+',"'+elem+'")',1000);
}
</script>
<div id="status"></div>
<script>countDown(60,"status");</script>

字符串
index.php

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>Real Time Data Display</title>
  </head>
  <body onload = "table();">
    <script type="text/javascript">
      function table(){
        const xhttp = new XMLHttpRequest();
        xhttp.onload = function(){
          document.getElementById("table").innerHTML = this.responseText;
        }
        xhttp.open("GET", "system.php");
        xhttp.send();
      }

      setInterval(function(){
        table();
      }, 5000);
    </script>
    <div id="table">

    </div>
  </body>
</html>

型
system.php

<?php
$conn = mysqli_connect("localhost", "root", "", "user");
$rows = mysqli_query($conn, "SELECT * FROM users_logs");
?>
<table border = 1 cellpadding = 10>
  <tr>
    <td>#</td>
    <td>user</td>
    <td>Plate</td>
    <td>age</td>
    <td>email</td>
  </tr>
  <?php $i = 1; ?>
  <?php foreach($rows as $row) : ?>
    <tr>
      <td><?php echo $i++; 
 $link = "<script>window.open('http://localhost/realtimedatadisplay/countdown.php')</script>";
 echo $link;
?>
</td>
      <td><?php echo $row["user"]; ?></td>
      <td><?php echo $row["plate"]; ?></td>
      <td><?php echo $row["age"]; ?></td>
      <td><?php echo $row["email"]; ?></td>
    </tr>
  <?php endforeach; ?>
</table>

<?php
$conn = mysqli_connect("localhost", "root", "", "user");
$rows = mysqli_query($conn, "SELECT * FROM users_logs");

$query = "SELECT * FROM users_logs";
$connect = mysqli_connect("localhost", "root", "", "user");
$result = mysqli_query($connect, $query);
$link = "<script>window.open('http://localhost/realtimedatadisplay/countdown.php')</script>";

$num_rows = mysqli_num_rows($result);
    if(!isset($_SESSION['user'])) {
        $check = $_SESSION['user'] = $num_rows;
    } else {
        $check = $_SESSION['user'];
    }
    echo $num_rows;
     if($num_rows > $check ) { 
        $check = $_SESSION['user'] = $num_rows;
        echo "new user";
        echo $link;
     } else {
        echo "wait";
     }
        
?>

的字符串
我是一个编程的初学者，我阅读和研究，但没有什么接近。
页面处于活动状态，当新数据插入数据库时，会出现一些模式或弹出窗口或新页面，并开始从1分钟到0倒计时，然后关闭，然后等待新插入的数据，然后再次开始倒计时。

php

来源：https://stackoverflow.com/questions/76737870/how-to-run-a-60sec-countdown-timer-or-open-a-countdown-php-when-new-data-is-inse

1条答案

按热度按时间

of1yzvn41#

在PHP循环中的脚本中输出window.open命令不会达到您想要的效果。这只会导致在每次执行PHP脚本时为数据库中的每一行生成脚本标记。
正如我在评论中所建议的，如果你想知道自从你上次查询服务器以来，是否有一个新的行（或多个行）被添加到数据库，你需要在你的页面中维护一个JS变量，它知道它从数据库收到的最后一个行ID，然后把它发送回服务器，这样它就知道从哪里开始服务行。注意：这假设您的数据库表有一个ID列，该列由自动递增生成。如果您的表中还没有这样的列，则需要在此之前添加它。然后JS代码需要查看它收到的响应，查看返回了多少新行，如果至少返回了一行，它就可以启动计时器。如果PHP以JSON格式返回数据，JS从中创建HTML表，则更容易做到这一点。
我还假设，由于计时器持续60秒，所以在轮询结束之前，从服务器轮询任何新行是没有意义的。（虽然，目前还不清楚计时器的用途是什么，所以这可能是一个错误的假设。如果是这样，请根据需要调整间隔计时器，但不要太频繁，以至于会使服务器过载多个并行请求。）

index.php

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>Real Time Data Display</title>
  </head>
  <body onload = "table();">
    <script type="text/javascript">
      var lastID = 0; //track the last record ID received from the server

      function table()
      {
        const xhttp = new XMLHttpRequest();
        xhttp.onload = function() {
          var result = JSON.parse(this.responseText);
    
          if (result.length > 0) 
          {
            window.open("countdown.php"); //open the countdown if needed
    
            var html = '';
            for (i = 0; i < result.length; i++) {
              html += "<tr>";
              html += "<td>" + result[i].id + "</td>";
              html += "<td>" + result[i].user + "</td>";
              html += "<td>" + result[i].plate + "</td>";
              html += "<td>" + result[i].age + "</td>";
              html += "<td>" + result[i].email + "</td>";
              html += "</tr>";
              lastID = result[i].id;
            }
            document.querySelector("#resultsTable tbody").innerHTML += html;
           }
        }
        xhttp.open("GET", "system.php?lastID=" + lastID);
        xhttp.send();
      }

      setInterval(function() {
        table();
      }, 60000);
    </script>

    <div id="table">
      <table id="resultsTable" border="1" cellpadding="10">
        <thead>
          <tr>
            <th>#</th>
            <th>user</th>
            <th>Plate</th>
            <th>age</th>
            <th>email</th>
          </tr>
        </thead>
        <tbody></tbody>
      </table>
    </div>
  </body>
</html>

字符串

system.php

//get the submitted last ID, or default to 0 if not provided
if (isset($_GET["lastID"]) { $lastID = $_GET["lastID"]; }
else { $lastID = 0; }

$conn = mysqli_connect("localhost", "root", "", "user");

//get all rows which are later than the last ID
$stmt = $conn->prepare("SELECT * FROM users_logs WHERE id > ?");
$stmt->bind_param("i", $lastID);
$stmt->execute();
$result = $stmt->get_result();
$rows = $result->fetch_all(MYSQLI_ASSOC);

//encode the array of rows in JSON format
echo json_encode($rows);

型
注意：正如在评论中所讨论的，使用 AJAX 的轮询解决方案是最简单的实现，但不太可能很好地扩展。在一个更大或更频繁使用的网站中，调查使用Websockets，或至少使用服务器发送事件，以向浏览器提供实时更新，以避免性能问题。

赞(0）回复(0）举报 2023-08-02

我来回答

如何运行一个60秒倒计时计时器或打开一个countdown.php时，新的数据插入数据库，我使用的是真实的数据显示？

1条答案

相关问题

热门标签

最新问答