是否有可能在MySQL上自动刷新DIV：PHP或Java Script或AJAX
[英]Is it possible to auto refresh a DIV on MySQL change in: PHP or Java Script or AJAX
问题描述
I have a facebook like system, I want the DIV containing the messages to automatically update when a new message is posted. 
我有一个类似Facebook的系统，我希望包含消息的DIV在发布新消息时自动更新。 Is this possible? 这可能吗？ If so, how would i go about doing this? 如果是这样，我将如何做到这一点？
<?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>
5 个解决方案
解决方案1
2 2010-12-06 19:40:21
<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>
As you can see, the JS code in the header is calling a file called response.php. 如您所见，标头中的JS代码正在调用名为response.php的文件。 That's the file which will refresh every 10 seconds. 这是每10秒刷新一次的文件。 Just change the value to increase/decrease the refresh period. 只需更改值即可增加/减少刷新周期。 The #responsecontainer div is where the response.php will be displayed. #responsecontainer div是将显示response.php 。
It's as easy as that. 就这么简单。
解决方案2
1 2010-08-15 22:55:08
make an ajax call to request for updated data. 进行ajax调用以请求更新数据。 wrap it in a function that recursively calls itself using setTimeOut(). 将它包装在一个使用setTimeOut（）递归调用自身的函数中。 Basically same principle as making a javascript clock (lookup tuts for that) except you use ajax to get current data instead of displaying time. 除了使用ajax获取当前数据而不是显示时间之外，基本上与制作javascript时钟（查找tuts）的原理相同。
解决方案3
1 已采纳 2010-08-15 22:58:15
you can use one of the techniques that are known as Comet 你可以使用一种称为Comet的技术
Or you could use XMPP over BOSH 或者你可以使用XMPP而不是BOSH
See also http://xmpp.org/extensions/xep-0124.html and http://xmpp.org/extensions/xep-0206.html 另见http://xmpp.org/extensions/xep-0124.html和http://xmpp.org/extensions/xep-0206.html
解决方案4
0 2010-08-16 09:16:18
Ajax is a client-based stateless system: Ajax是一个基于客户端的无状态系统：
the client must contact the server,it can't be the server contacting the user but you can create a simple ajax function that check a page every X seconds if there are news. 客户端必须联系服务器，它不能是服务器联系用户，但你可以创建一个简单的ajax函数，如果有新闻，每X秒检查一次页面。
if you want you can reduce the amount of ajax request you can hold the page for example for 5 seconds checking it 10 times and sleeping 0.5s each time it fails to get news. 如果你想要你可以减少ajax请求的数量，你可以保持页面例如5秒钟检查它10次，每次无法获得新闻时睡眠0.5秒。
解决方案5
0 2010-08-16 21:33:21
XMPP over Bosh is the best solution here if your application really need real-time-update (Real time in the real sense). 如果您的应用程序确实需要实时更新（真实意义上的实时），那么在Bosh上的XMPP是最佳解决方案。 Jaxl library provides integrated support for XMPP over Bosh, you might want to try this for your application http://github.com/abhinavsingh/JAXL Jaxl库为Bosh提供了对XMPP的集成支持，你可能想为你的应用程序试试这个http://github.com/abhinavsingh/JAXL
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.