如何每30秒加载一次页面的一部分[重复]答案

【问题标题】：How to load a part of page every 30 seconds [duplicate]如何每30秒加载一次页面的一部分[重复]
【发布时间】：2012-07-05 10:14:22
【问题描述】：

可能重复：
jQuery Ajax request every 30 seconds

我知道我们可以在某些事件上加载页面的一部分。我也知道我们可以在每个指定时间加载整个网页。但我想知道如何每 30 秒加载一次页面的一部分。

【问题讨论】：

如果您使用 AJAX，您可以使用 setInterval() 函数调用 AJAX 方法。 developer.mozilla.org/En/Window.setInterval
@antyrat 使用 setInterval 和 AJAX 是一个非常的坏主意。
@FlorianMargaine 那么有什么好主意？
我不想使用 setinterval，因为它不必要地访问服务器，即使没有更新。有没有什么办法可以在服务器上更新数据后，它会加载到我的页面上。
您可以查看 long poll ajax 调用，这是等待很长时间，然后超时，然后重新连接很长时间，然后获取数据，然后重新连接等的 ajax 调用。

标签： javascript jquery html ajax javascript-events

【解决方案1】：

function refreshPage() {
    $.ajax({
        url: 'ajax/test.html',
        dataType: 'html',
        success: function(data) {
            $('.result').html(data);
        },
        complete: function() {
            window.setTimeout(refreshPage, 30000);
        }
    });
}

window.setTimeout(refreshPage, 30000);

使用setTimeout 的好处是，如果连接挂起一段时间，您将不会收到大量待处理的请求，因为只有在前一个请求完成后才会发送新请求。

【讨论】：

老兄第二次不需要setTimeout
@Random 当然有。否则，您将立即重新启动下一个 ajax 调用。

【解决方案2】：

function load_content(){

    setTimeout(function(){

        $.ajax({
            url: 'ajax/example.html',
            dataType: 'html',
            success: function(data) {
                $('.result').html(data);
                load_content();
            }
        });dataType: 'html',

    },30000);

}

load_content();

【讨论】：

在 AJAX 中使用 setInterval 是一个非常的坏主意。
@FlorianMargaine 你会怎么做呢？
setTimeout 并在上一个请求成功或失败后创建一个新的超时（即在complete 回调中）
@FlorianMargaine 请详细说明
setTimeout( function load() { $.ajax({ complete: function() { setTimeout( load, 30000 ); }) }, 30000 )

【解决方案3】：

jQuery 已经内置了用远程文件替换元素内容的功能，称为load()。使用load()，您可以使用此单线：

window.setTimeout($('#refresh').load('/remote/content.html'), 30000);

#refresh是要刷新的元素的id，/remote/content.html是远程内容。

【讨论】：

【解决方案4】：

$(function() {
   setInterval(function() {
     getData();  // call to function
   }, 30000 );  // 30 seconds
});


// define your function here
function getData() {
   var url ="/mypage.php?type=load_data";
   var httpobj = $.ajax({url:url,async:false});  // send request
   var response = httpobj.responseText.trim(); //get response
   $('#myDiv').html(response);  // display data
}

【讨论】：

阅读所有其他答案的 cmets。说真的。

【解决方案5】：

如果你使用 jQuery，你可以使用load() 方法

setInterval(function(){

    $('#some-kinda-container').load('/some/kinda/url.html #bit-you-need');

}, 30000);

【讨论】：

查看@Jleagle's answers' cmets 了解为什么使用setInterval 是一个非常坏主意。
如果你的 ajax 调用没有在 30 秒内完成，你有比 setInterval 更重要的事情要担心
第一次不是30秒左右，而是保持不变。如果您需要 2 秒来获得响应，您将在 5 分钟左右重叠您的请求（没有计算，但您明白了）
只有 load() 时间肯定超过 30 秒才会有重叠？
不行，多次请求后会有重叠，每次2秒。 15 个请求之后，两个请求会相互重叠。