刷新html div ONLY ONCE而不会使页面变得很慢

时间:2014-06-04 18:48:29

标签: php jquery html ajax refresh

我遇到了这个问题:点击一个按钮,我运行了一个PHP脚本,感谢ajax。但同时我想在同一页面重新加载/刷新一个html div。所以,当我这样做的功能,如:7 `

setInterval(function() {
$("#IdDiv").load(location.href+" #IdDiv>*","");
}, 500);

` 页面运行得非常慢,mybe因为重载在循环中运行,我希望知道原因。 刷新必须在后台。 你知道解决方案吗?感谢

2 个答案:

答案 0 :(得分:0)

这不是你从ajax调用中检索数据的方式。使用ajax将数据发送到您的php文件,在php中从db获取对象形式的数据,然后以json格式打印或退出此对象:

file.php:

// some logic here
exit json_encode($dataFromDB);

$ dataFromDB将成为你的ajax响应对象。这是一个如何使用它的例子(使用jQuery)。

$.post("file.php", {data}, function(response) {
    // response object contains the data for you to append to webpage
    $("#myDiv").val(reponse.value);
}, "json");

顺便说一句。 setInterval连续运行,setTimeout只运行一次。

答案 1 :(得分:0)

  

刷新必须在后台

似乎正在使用setInterval,因为它认为$.load是同步的 - 它不是。

$ .load是 A 同步

使用以下代码:

$('<div/>').load('/', function() { console.log('second'); }); 
console.log('first');

结果是:

  

第一

     

第二

在来自服务器的响应之前执行加载调用之后的代码。因此,要在后台实现更新div - 只需正常调用它:

$("#IdDiv").load(url);

setInterval和setTimeout

让我们看一下何时使用setIntervalsetTimeout(因为setTimeout可能与问题中的代码有关,而setInterval用于错误)。

何时使用setTimeout

使用setTimeout在将来的特定(虽然,大致)时间做一次事情:

setTimeout(function() {
    // code to be executed exactly once, one second from now
}, 1000);

何时使用setInterval

使用setInterval在将来重复执行某些操作

now = new Date();
seconds = $('#seconds');

setInterval(function() {
    seconds.html(now.getSeconds());
}, 1000);

非常谨慎对setInterval任何可变持续时间的呼叫进行调用,或者在正常情况下可能延迟的事情 - 否则会出现相同症状的风险。问题,即回调最终并行运行,可能导致浏览器崩溃。

何时使用setTimeout作为伪间隔

有一种情况适合两种方法setTimoutsetInterval。如果需要在循环中运行某些内容,并且在之间连续调用

请考虑以下事项:

url = '/whatever';
function loopForever() {
    $("#IdDiv").load(url, function() {
        setTimeout(loopForever, 1000);
    });
}

此代码将加载url,然后从完成后加载一秒 - 再次加载(再次调用命名函数)。以这种方式使用setTimeout可以避免并行执行回调的问题,因为下一次迭代只安排在最后一次完成时开始。