刷新div以从数据库中检索信息，而无需刷新整个页面 [英] refresh div to retrieve information from database without refreshing wholepage
问题描述
我想每2秒刷新一次div auto而无需重新加载页面，我该如何用jquery做到这一点，我确实尝试了一些解决方案，但如果能帮上大忙，那他们就行不通了
I would like to refreash the div auto every 2 seconds without reloading the page how can i do this with jquery i did try some solutions but they did not work if can help that would be great
conversation.php
<?php
$hash =$run_con['hash'];
while($run_message = mysql_fetch_assoc($message_query))
{
$from_id = $run_message['from_id'];
$message = $run_message['message'];
$user_query = mysql_query("SELECT `username` FROM `users` WHERE `id`='$from_id'");
$run_user = mysql_fetch_array($user_query);
$from_username = $run_user['username'];
echo "<div id='auto'<p><b>$from_username</b><br />$message</p> </div>"; //reload this part every 2 seconds
}
?>
<script>
$(document).ready(function(){
setInterval(function(){
$("#auto").load('conversation.php'+$hash)
}, 2000);
});
</script>
推荐答案
为了每2秒进行一次查询，而该查询不会刷新页面本身，您需要使用jQuery和AJAX.为此，您应该使用每2秒调用一次的查询创建一个自己的文件.
In order to make a query every 2 seconds that doesn't refresh the page itself, you'll need to use jQuery and AJAX. For this to work, you should create a file of it's own with the query that is being called every 2 seconds.
让我们从jQuery开始.
Let's start with the jQuery.
为使此脚本真正起作用，您需要包括jQuery.在页面上的HTML <head></head>-标记内，包括以下行
For this script to actually work, you'll need to include jQuery. Inside the HTML <head></head>-tags on your page, include the following line
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.js"></script>
没有这个，您将无法运行任何jQuery函数.现在，您已经包括了这一步，您可以构建实际的脚本.
Without this, you can't run any jQuery functions. Now that you have included this, you can build the actual script.
为了稍微解释一下它是如何工作的，我创建了一个名为ajaxCall的函数.此函数在ajax.php中执行脚本，当脚本执行成功后，它将ajax.php的输出替换为当前页面上ID为div1的div上的内容.加载页面(ajaxCall();)时执行一次此操作，此后每2秒钟执行一次.
To explain a bit on how this works, I've created a function called ajaxCall. This function executes the script inside ajax.php, and when it's successful with that, it replaced the output from ajax.php with the content on your div that has an id div1, on the current page. This action is performed once when the page is loaded (ajaxCall();) and every 2 seconds after that.
<script>
function ajaxCall() {
$.ajax({
url: "ajax.php",
success: (function (result) {
$("#div1").html(result);
})
})
};
ajaxCall(); // To output when the page loads
setInterval(ajaxCall, (2 * 1000)); // x * 1000 to get it in seconds
</script>
将此脚本放置在您要重新加载div1的同一文件中(当然，您可以随意将其重命名，只是保持不变).
Place this script in the same file where you want the div1 to be reloaded (of course you can rename it as whatever you please, just be persistent).
所以您的conversation.php现在应该有...
So your conversation.php should now have...
- 包含了jQuery库
- 执行AJAX调用的脚本
- 一个ID为"div1"(
<div id="div1"></div>)的div，其中将放置ajax.php的内容.
- included the jQuery libary
- the script to perform the AJAX-call
- a div with id "div1" (
<div id="div1"></div>), where the contents ofajax.phpwill be put.
对于ajax.php文件，这是您实际执行查询的地方.对于您的情况，这就是您放置
As for your ajax.php file, this is where you'll actually perform your query. For your case, that would be where you put
<?php
mysql_connect("localhost", "user", "pass");
mysql_select_db("database");
// Other variables needed to perform the query, such as $message_query
// needs to be here as well
while ($run_message = mysql_fetch_assoc($message_query)) {
$from_id = $run_message['from_id'];
$message = $run_message['message'];
$user_query = mysql_query("SELECT `username` FROM `users` WHERE `id`='$from_id'");
$run_user = mysql_fetch_array($user_query);
$from_username = $run_user['username'];
echo "<p><b>$from_username</b><br />$message</p>";
}
?>
您应该 停止使用mysql_*函数 (如果可以)，因为它们已弃用，不再维护.另外，使用mysqli_*或PDO将允许使用准备好的语句，因此您可以防止
You should stop using mysql_* functions if you can, as they are deprecated and no longer maintained. In addition, usage of mysqli_* or PDO will enable usage of prepared statements, so that you can prevent SQL-injection.
这篇关于刷新div以从数据库中检索信息，而无需刷新整个页面的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
