是否可以在 MySQL 更改中自动刷新 DIV：PHP 或 Java Script 或 AJAX答案

【问题标题】：Is it possible to auto refresh a DIV on MySQL change in: PHP or Java Script or AJAX是否可以在 MySQL 更改中自动刷新 DIV：PHP 或 Java Script 或 AJAX
【发布时间】：2011-03-30 05:01:16
【问题描述】：

我有一个类似 facebook 的系统，我希望包含消息的 DIV 在发布新消息时自动更新。这可能吗？如果是这样，我该怎么做？

<?php include('config.php'); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
    <head>
        <title>Alpha</title>
        <link rel="stylesheet" href="style.css" type="text/css" />  
    </head>
    <body>

<?php 

// Logged IN
if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Email'])) {


// Post to Database
if(!empty($_POST['message']))
{
$message = mysql_real_escape_string($_POST['message']);
$postmessage = mysql_query("INSERT INTO Wall (Message, UserID) VALUES('".$message."', '".$_SESSION['UserID']."')");
}

// Collet Latest Posts

$query = "
    SELECT Users.UserID, Wall.Message, Users.Forename, Users.Surname 
    FROM Wall
    INNER JOIN Users ON Wall.UserID = Users.UserID
    ORDER BY Wall.MessageID DESC
    LIMIT 20;";
$result = mysql_query($query) or die('Invalid query: ' . mysql_error());

// Collet Post User
    ?>
    <div id ="container">
        <div id="insideleft">
            <ul>
                <li><a href="index.php">Home</a></li>
                <li><a href="profile.php">Edit Profile</a></li>
                <li><a href="wall.php">Community Wall</a></li>
                <li><a href="logout.php">Logout</a></li>
            </ul>
        </div>
        <div id="insideright">
            <h1>Community Wall</h1>
            <br />
            <div id="postcontainer">
                <form method="post" action="wall.php" name="wallpost" id="wallpost">
                    <input type="text" name="message" id="message" class="message" />
                    <input type="submit" name="messagesub" id="messagesub" value="Post Message" class="post"/><br /><br />
                 </fieldset>
                </form>
            </div>
            <?php while ($row = mysql_fetch_assoc($result)) { ?>
            <div id="messagecontainer">
            <p class="messageposter">
            <?php echo "<b>{$row['Forename']} {$row['Surname']}</b><br />"; ?>
            </p>
            <p class="message">
            <?php echo stripslashes($row['Message']); ?>
            </p>
            </div>

<?php
} ?>

        </div>
    </div>
    <?php
}

else {echo "<meta http-equiv='refresh' content='0;index.php'>";}

?>
</body>
</html>

【问题讨论】：

标签： php javascript mysql ajax refresh

【解决方案1】：

<html>
<head>
<!-- For ease i'm just using a JQuery version hosted by JQuery- you can download any version and link to it locally -->
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
    $("#responsecontainer").load("response.php");
    var refreshId = setInterval(function() {
        $("#responsecontainer").load('response.php?randval='+ Math.random());
    }, 9000);
});
</script>
</head>
<body>

<div id="responsecontainer">
</div>
</body>

如您所见，标头中的 JS 代码正在调用一个名为 response.php 的文件。那是每 10 秒刷新一次的文件。只需更改值以增加/减少刷新周期。 #responsecontainer div 是显示 response.php 的位置。

就这么简单。

【讨论】：

【解决方案2】：

您可以使用一种称为Comet的技术

或者你可以使用XMPP over BOSH
另见http://xmpp.org/extensions/xep-0124.html 和http://xmpp.org/extensions/xep-0206.html

【讨论】：

【解决方案3】：

进行 ajax 调用以请求更新数据。将它包装在一个使用 setTimeOut() 递归调用自身的函数中。基本上与制作 javascript 时钟（为此查找 tuts）的原理相同，只是您使用 ajax 来获取当前数据而不是显示时间。

【讨论】：

【解决方案4】：

Ajax 是基于客户端的无状态系统：
客户端必须联系服务器，它不能是服务器联系用户，但您可以创建一个简单的 ajax 函数，如果有新闻，每 X 秒检查一次页面。

如果您愿意，您可以减少 ajax 请求的数量，例如，您可以将页面保持 5 秒，检查 10 次，每次无法获取新闻时休眠 0.5 秒。

【讨论】：

【解决方案5】：

如果您的应用程序确实需要实时更新（真正意义上的实时），则基于 Bosh 的 XMPP 是最佳解决方案。 Jaxl 库通过 Bosh 为 XMPP 提供集成支持，您可能想为您的应用程序尝试此功能http://github.com/abhinavsingh/JAXL

【讨论】：