javascript - 如何在JQuery中显示动态更新的数据

Question

我试图显示数据库中有多少行。这应该是动态更新的，因此当行数发生变化时，显示的数字也会更新。我尝试用 PHP 打印它，但它不是动态的。

这是索引文件:

  <script>
      $(document).ready(function() {
          setInterval("ajaxcall()",2000);
      });

      function ajaxcall() {
       $.ajax({
       type: "GET",
       url: "count.php"
       success: function(response){
           json_object = JSON.parse(response)
           var count = json_object.count

       // HOW TO DISPLAY COUNT SO IT IS DYNAMIC
       }
       });
       }
       </script>

这是 count.php

$num_rows = mysql_num_rows($result);
echo json_encode($num_rows);

Answer 1

您需要 -

• 定期进行 ajax 调用来检查更新的值。(这就是您当前正在做的事情。)-- 如果用户要连接很长时间，这通常是一个坏主意。
• 或者，更好的解决方案是使用 HTML5 web sockets相反。

类似 socket.io 的项目使得在 javascript 服务器(节点)上实现 websockets 变得非常容易。但 PHP 也有一些选择。 -

• Ratchet - 与socket.io类似，但为PHP构建。
• Elephant.io - 也是 websockets 的 PHP 实现，但它是一个 ws“客户端”，旨在在服务器上工作。因此，您可能还需要在服务器上部署 node 和 socket.io，并使用elephant.io 驱动它来处理与其他客户端的 websocket 通信。
• phpsocket.io - “基于 Workerman 的 PHP 中 socket.io 的服务器端替代实现。” - 根据其 github 页面。

phpsocket.io 上没有太多文档，但从自述文件中的示例来看，API 看起来很简单。像这样的东西应该对你有用——

<?
use PHPSocketIO\SocketIO;

// listen port 2021 for socket.io client
$io = new SocketIO(2021);
$io->on('connection', function($socket)use($io){
    $socket->on('get count', function($msg)use($io){
        $num_rows = mysql_num_rows($result);
        $io->emit($num_rows, $msg);
    });
});

在客户端--

var count = 0;
// check if browser supports websockets
if ("WebSocket" in window) {
    var ws = new WebSocket("ws://yourdomain.com:2021/");
    ws.onopen = function() {
        // Web Socket is connected, send data using send()
        ws.send("get count");
    };
    ws.onmessage = function (evt) { 
            var received_msg = evt.data;
            json_object = JSON.parse(response)
            count = json_object.count
            $("#database-results").text(count);
    };
}

*免责声明 - 我之前没有测试过上面的代码或使用过 phpsocket.io 库。所以该代码可能无法工作。此外，Ratchet 看起来是一个更成熟的项目，因此如果您想要为您的应用程序提供更强大的解决方案，您应该进一步研究它。

我从this得到了很多上述信息所以线程。然而，其中的一些信息已经过时了几年，而且那里评价最高的答案并不能提供当今最好的解决方案。