Question

我正在撰写一份实时讨论表。该页面从MySQL加载线程，并每4秒通过AJAX刷新一次。在每个帖子的最后评论之后，有一个评论的文本输入（非常类似于Facebook）。

一切正常，但是当用户在输入中写入并且页面刷新时，消息将消失。安全和隐私是这个项目的主要目标，这就是我不想使用cookie的原因。我尝试了很多解决方案，并搜索了几个小时的解决方案，但似乎没有任何效果。

每次刷新页面时，$_post是否可能成为解决方案？
如果要缓存输入的值并从$_session或本地存储中检索它们，是否有人可以建议更具体的方法？即：把听众放在哪里：）
如果输入的值不同于“”，我试图创建一个阻止重新加载页面的函数，但即使这对我也不起作用。

这是我的刷新代码：

<script type="text/javascript">
    var PHP = "msgboard.php";  

    function updateShouts(){
        $('#msgboard').load(PHP);       
    }

    window.setInterval( "updateShouts()", 4000 );
</script>

这是PHP的主要功能：

while($row = mysql_fetch_array($resultados)) { 

    echo '<div class="post">
            <div class="user"><b>'.$row["user"].'</b></div>';
    echo '  <div class="txt">'.$row["msg1"].'</div>
          </div>';

        $sql2="SELECT * FROM table WHERE masterid = '".$row['id']."'ORDER BY id ASC";
        $resultados2 = mysql_query($sql2);
        while($row2 = mysql_fetch_array($resultados2)) { 
            echo '<div class="comment">
                    <div class="txt"><b>'.$row2['user'].'</b>';
            echo '  '.$row2['msg1'].'</div>
                  </div>';
        }

    echo '<div class="commentform">
            <form action="board.php" method="post">
            <input type="text" size="75" name="message" id="message1">
            <input type="hidden" name="masterid" value="'.$row['id'].'">
            <input type="submit" name="Submit" value="Enviar"></form>
        </div>' ;
}

提前致谢！

Answer 1

Perhaphs你应该研究有状态的HTTP连接。因此，只要在服务器端向电路板添加新消息，就会通知所有客户端。这样，您就不必不必要地刷新页面。 HTML5支持可以实现的Web套接字。以下是我遇到的一些您可能会觉得有用的链接：

Create Bi-directional connection to PHP Server using HTML5 Web Sockets Wikipedia Page on WebSocket

socketo.me

Answer 2

正如@aziz在评论中指出的那样，如果您只想更新评论，则只需要更新页面的那一部分。

第1步：在评论中添加容器，以便将更新定位到该容器

您会注意到代码中现在有一个新的div <div id="comments_contaner">，其中包含所有注释。

另外，当您输出HTML时，如果需要在HTML中放置PHP变量，关闭PHP标记并使用<?= $variable ?>会更容易/更有效。

<强> msgboard.php：

<?
while($post = mysql_fetch_array($resultados))
{
?>
    <div class="post">
        <div class="user"><b><?= $post["user"]?></b></div>
        <div class="txt"><?= $post["msg1"]?></div>
    </div>
    <div id="comments_contaner">
<?
    // This code can be ommited as you can just call updateShouts() upon page load to fetch the comments
    $comments = mysql_query("SELECT * FROM table WHERE masterid = '{$post['id']}' ORDER BY id ASC");
    while($comment = mysql_fetch_array($comments))
    {
?>
        <div class="comment">
            <div class="txt"><b><?= $comment['user'] ?></b> <?= $comment['msg1'] ?></div>
        </div>
<?
    }
?>
    </div>
    <div class="commentform">
        <form action="board.php" method="post">
            <input type="text" size="75" name="message" id="message1">
            <input type="hidden" name="masterid" value="<?= $post['id'] ?>">
            <input type="submit" name="Submit" value="Enviar">
        </form>
    </div>
<?
}
?>

第2步：创建PHP函数以更新注释

此函数仅输出注释，需要masterid作为参数来知道要输出的注释。

<强> updateComments.php：

<?
    $masterid = $_GET['masterid']
    $comments = mysql_query("SELECT * FROM table WHERE masterid = '{$masterid}' ORDER BY id ASC");
    while($comment = mysql_fetch_array($comments))
    {
?>
        <div class="comment">
            <div class="txt"><b><?= $comment['user'] ?></b> <?= $comment['msg1'] ?></div>
        </div>
<?
    }
?>

步骤3：在脚本中调用面向容器div的PHP更新功能

您需要将$row['id']作为参数传递到网址

<script type="text/javascript">
    var PHP = "updateComments.php?masterid=<?= $post['id']?>";  

    function updateShouts(){
        $('#comments_contaner').load(PHP);       
    }

    window.setInterval( "updateShouts()", 4000 );
</script>

PD：我还没有测试过这段代码，只是为了向您展示主要想法。

编辑：更正了变量名称并添加了评论。

如何使用ajax刷新并保留表单数据

2 个答案: