使用Javascript刷新DIV并限制时间

时间:2012-04-02 13:18:23

标签: php javascript jquery settimeout

我使用以下javascript每30秒在页面上刷新div:

<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript">
$(function(){
    $(document).ready(function(){
        $.ajaxSetup({cache: false});
    });
    getStatus();
});
function getStatus() {
    $('div#content').load('ajax_stream.php').fadeIn("slow");
    setTimeout("getStatus()",30000);  // refresh every 30000 milliseconds (30 seconds)
}
</script>

我觉得需要某种形式的限制,以便在'n'分钟后,我们停止刷新div - 即如果用户永远打开浏览器,我们不仅仅是继续消耗服务器资源。

我怎样才能做到这一点?另外,如果我想在超时时调用DIV中的新文件,那么最好的方法是什么?

4 个答案:

答案 0 :(得分:5)

也许你可以,只需存储超时并检查以毫秒为单位的时间是否低于希望脚本停止的时间(以分钟为单位)?

var timerunning;
...
timerunning = timerunning + 30000;
if(timerunning < 120000){
    setTimeout("getStatus()",30000); 
}

虽然没有测试,祝你好运:)

答案 1 :(得分:3)

这个解决方案怎么样?

<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript">
    var statusUpdateTimeout = null;
    $(function(){
        $(document).ready(function(){
            $.ajaxSetup({cache: false});
        });

        // Run get status and repeat every 30 seconds
        getStatus();
        statusUpdateTimeout = setInterval("getStatus()", 30000);

        // Stop updating after 15 minutes
        setTimeout(function() {
            if(statusUpdateTimeout) clearInterval(statusUpdateTimeout);
        }, 900000);
    });

    function getStatus() {
        $('div#content').load('ajax_stream.php').fadeIn("slow");
    }
</script>

我将setTimeout替换为setInterval,并将其移至getStatus函数之外。此外,我设置了一个新的超时,将在15分钟后停止间隔。

此外,为了将来参考,请正确缩进您的代码,以便其他人可以阅读。

答案 2 :(得分:0)

我认为最适合您的解决方案是设置一个全局变量,每次执行 getStatus()时都会增加,并在$('body')上将其设置为0.mousemove( ); (这是Gmail用于在web gmail聊天中将用户状态设置为IDLE的行为)

答案 3 :(得分:0)

以下是如何操作:

<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript">
//when the page loads, the user is idle for 0 seconds
var idle=0;
$(function(){
    $(document).ready(function(){
        $.ajaxSetup({cache: false});
    });
    getStatus();
});
function getStatus() {
    idle+=1;
    //if idle for 5 minutes, do nothing
    if (idle==10) return;
    $('div#content').load('ajax_stream.php').fadeIn("slow");
    setTimeout("getStatus()",30000);  // refresh every 30000 milliseconds (30 seconds)
}
//reset the counter whenever an activity is done on the page
$('body').mousemove(function(){
    idle=0;
});
</script>