自动刷新包含DIV内的PHP文件

时间:2014-02-06 10:26:06

标签: javascript php jquery

我有一个名为messages.php的文件,它将SQL查询运行到数据库并以$res变量显示结果

我使用的menu.php页面

include 'messages.php';

然后:

<div id="msgs">
<?php echo $res; ?>
</div>

所以这会在menu.php上的div中的messages.php页面显示$res变量中的所有数据

如何让它自动刷新,以便显示$res变量中的任何新数据而无需刷新menu.php页面?

3 个答案:

答案 0 :(得分:2)

首先删除包含'messages.php'; 然后删除echo $ res;来自div并将其放在messages.php的最后一行

并在包含jquery文件

后尝试以下代码
<script>
jQuery().ready(function(){
    setInterval("getResult()",1000);
});
function getResult(){   
    jQuery.post("messages.php",function( data ) {
        jQuery("#msgs").html(data);
    });
}
</script>
<div id="msgs">
</div>

答案 1 :(得分:1)

需要 jQuery 库。它可以在纯JS 中完成,但如果你是JS 初学者,我建议使用 jQuery

function reload_messages(){
    $.get("messages.php", function(data) {
        $("#id").html(data);
    });
}

然后您需要调用 reload_messages,例如:

<a href="javascript:reload_messages();">reload messages</a>

如果您想扩展.get方法,请查看此页面:https://api.jquery.com/jQuery.get/

答案 2 :(得分:1)

如果您希望在某个时间间隔内刷新,则可以使用setInterval

setInterval( refreshMessages, 1000 );

1000是1000毫秒,所以1秒,根据你的喜好改变它。

所以每1秒触发一次函数refreshMessages:

function refreshMessages()
{
    $.ajax({
        url: 'messages.php',
        type: 'GET',
        dataType: 'html'
    })
    .done(function( data ) {
        $('#msgs').html( data ); // data came back ok, so display it
    })
    .fail(function() {
        $('#msgs').prepend('Error retrieving new messages..'); // there was an error, so display an error
    });
}