如何每隔几秒在 php 中刷新具有打印语句和图像功能的 div

Question

我正在尝试构建一个浏览器纸牌游戏，主要使用 PHP 和一些其他有用的语言来测试和扩展我的 PHP 知识，以及我一直想做的东西。但是我阅读并尝试实施的所有在线解决方案都行不通，而且我也不知道为什么。我有这样的逻辑：

//find game form
        print "<form method='post' action='game.php'>
        <label>Enter host generated game #</label><br>
        <label><input type='text' name='gamenumber'></label><br>
        <label><input type='submit' name='findgame' value='FindGame'></label><br><br>
        </form>";

        //host game button
        print "<form method='post' action='game.php'>
        <label><input type='submit' name='hostgame' value='HostGame'></label>
        </form>";

//game logic



if(isset($_POST['hostgame'])) 
    {
        $roomnumber = rand();
        print $roomnumber;

        insertField($Ausername,$roomnumber); //insert field GUI

        //link game to host for future field printing
        $query = "UPDATE game".$roomnumber." SET host='".$Ausername."' WHERE host='null'";
        $result = mysqli_query($link, $query);

        print "<div id='quote'>"; //populate host just disappears <meta http-equiv='refresh' content='5' />

        //populates self and opponents in hosts perspsective
        populatehost($roomnumber); 

        print "</div>";


    }

    if(isset($_POST['findgame'])) //this processes after user submits data.
    {
        $roomnumber = $_POST['gamenumber'];
        $_SESSION['gamenumber'] = $_POST['gamenumber'];

        //link game to find for future field printing
        $query = "UPDATE game".$roomnumber." SET find='".$Ausername."'WHERE find='null'";
        $result = mysqli_query($link, $query);

        print "<form method='post' action='game.php'>
        <label><input type='submit' name='startgame' value='StartGame'></label>
        </form>";

        //populates self and opponents in finds perspsective
        populatefind($roomnumber); 

    }


    if(isset($_POST['startgame'])) //this processes after user submits data.
    {
        print "<br>Game started.<br>";

        print "heads or tails?\n\n";

        print "<form method='post' action='game.php'>
        <label><input type='text' name='headstails'></label><br>
        <label><input type='submit' name='select' value='Select'></label><br><br>
        </form>";

        //finder always starts game
        populatefind($_SESSION['gamenumber']);
    }

    $gameStatus="";
    $flip = rand(1,2);
    $coin = "heads";
    $gameStarted = "game not started";

    if($flip==1)
        $coin="heads";
    else if($flip==2)
        $coin="tails";

    if(isset($_POST['headstails'])) //this processes after user submits data.
    {
        if($_POST['headstails']==$coin)
        {
            print "find game player goes first";
            $gameStarted = "game started";
            //notify find game player he goes first
            //do logic where he goes first
        }
        else
        {
            print "host game player goes first";
            $gameStarted = "game started";
            //notify host game player he goes first
            //do logic where he goes first
        }

        populatefind($_SESSION['gamenumber']);
    }

这是我尝试粘贴在页面底部的 jquery 函数。

?>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js%22%3E%3C/script%3E">
    jQuery(function () {
        var $els = $('div[id^=quote]'),
            i = 0,
            len = $els.length;

        $els.slice(1).hide();
        setInterval(function () {
            $els.eq(i).fadeOut(function () {
                i = (i + 1) % len
                $els.eq(i).fadeIn();
            })
        }, 2500)
    })
</script>

</body>
</html>

所以我能够为主持人和发现者打印该字段，并且一旦发现者抛硬币，它就会说从他们的角度来看谁先走..但是我很难让它出现在其他玩家的视角。我正在考虑通过使用执行所有打印的功能刷新 div 来实现它，但无论如何似乎都没有用。我以多种不同的方式尝试了 php 睡眠方法，我尝试了一些 jquery 函数，但没有任何效果。顺便说一下，populate host 和 populate find 只是具有基于变量数组的巨型表的函数。

Answer 1

您尝试实现的这类事情会使用常规 Ajax 调用消耗服务器的大量资源。

类似问题：Link

让我们以两个用户之间的聊天为例：

用户的 1 页面有一个 Java脚本计时器每秒询问新消息："hey server, send me new messages." 无论是否有新消息，服务器都会处理请求，搜索新消息回复"I've got no messages for you right now"或"here is your new message"。用户 2 相同。

如果两个用户保持聊天页面打开 10 秒，您的服务器将收到 20 条新消息请求，运行 20 次搜索新消息并发送 20 条新消息回复或"no new messages"回复。即使两个用户都没有发送任何内容，只是保持页面打开。想象一下，如果有 1000 个用户连接到您的聊天室！

这种情况下最好的方法是 Socket。在同一个聊天示例中，用户 1 和用户 2 将继续收听新消息，而不是每秒询问一次。当用户1发送消息时，服务器会通知用户2"I have a new message for you. Here is."

如果连接1000个用户，完全没有问题。服务器会将新消息发送到套接字通道，并通知所有连接的用户。没有延迟。

在您的特定情况下，将像这样工作：播放器 1 和播放器 2 正在侦听新消息。当玩家 1 点击卡片时，将触发服务器命令。服务器将接收和发送套接字通道的消息："hey everyone who is awaiting for new cards, here is" 然后每个玩家都会收到通知。即刻。

第一个场景的另一个问题，使用 Java 脚本计时器：如果您增加计时器间隔，回复将延迟传递。

套接字的另一个好处是：它独立于技术。 PHP、Java、节点等

GitHub 将 WebSocket 与 Php 一起使用的项目：Link

You can see some socket demos here

Here is a repository with some tests I ran when I tried Socket earlier

Answer 2

你可以这样做：

setInterval(function refresh(){
  var value = Math.round(Math.random()*100);
  $("#target").addClass("hidden");
  $("#target").html(value);
  $("#target").removeClass("hidden");
}
, 1500);

.hidden {
  display: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="target">
</div>

如何每隔几秒在 php 中刷新具有打印语句和图像功能的 div

how to refresh a div with a function of print statements and images in php every few seconds

javascript

php

ajax

jquery

page-refresh