使用Jquery自动刷新多个div

为工作中的大型显示创建仪表板，我设法让一个div自动刷新php请求页面，但我想不出在另一个div上使用此功能的方式为另一个脚本而不复制整个函数并重命名它，这似乎是愚蠢的。使用Jquery自动刷新多个div

这是我到目前为止有：

<script type="text/JavaScript"> 
$(document).ready(
function update() 
{ 
    $.get("response.php", function(data){ 
      $("#ajaxtest").html(data); 
      window.setTimeout(update, 10000); 
     }); 
}); 
</script>

我这样做的计算器一些搜索，发现这个漂亮的小物，虽然其单格只使用...（second example: auto refreshing div with jquery）

来源

2010-11-16 GodsDead

当文档准备就绪时，您的更新功能已被直接调用。这不一定是个好主意，你希望这个函数可以被多次调用。例如，考虑下面的（未测试的代码！）：

function update(divId) 
{ 
    $.get("response.php", function(data){ 
    $(divId).html(data); 
    window.setTimeout(update, 10000); 
}

然后

$(document).ready(function(){ 
    update("#ajaxtest"); 
    update("#otherdiv"); 
    update(".divsbycssclass"); 
});

如果你需要一个不同的URL传递，在太。您可以通过计时器或事件来调用此更新方法：

$("a").click(function(){ 
    update("#ajaxtest"); 
});

这就是您所说的？如果没有，请随时发表评论，我会编辑。

来源

2010-11-16 11:50:11 Simon

$(document).ready(

function update(el) 
{ 
    $.get("response.php", function(data){ 
    el.html(data); 
    window.setTimeout(el, 10000); 
}); 

update($("#ajaxtest")); 

});

来源

2010-11-16 11:50:47

就像一个指针：[Stack Overflow的降价/编辑帮助页面]（http://stackoverflow.com/editing-help）。欢迎来到SO！ =） – 2010-11-16 11:52:55

你基本上需要做的是一次返回多个内容集。这意味着以某种结构发送数据，所以你的JS可以快速解析它并适当地应用内容。最好的方法是使用JSON - 一种易于阅读并且是Javascript的子集的数据交换格式。

首先，改变你的PHP做内容的数组发送：

$divs = array (
    'firstDiv' => $firstDivContent, 
    'secondDiv' => $secondDivContent 
);

然后您就需要使用json_encode将它们编码为JSON：

$divs_json = $divs;

那么这回浏览器与适当的标题：

header('Content-type: application/json'); 
echo $divs_json; 
die();

在您的Javascript，你将只有需要d提出一个请求以接收这两个部分。您可以使用setInterval和一个匿名函数，使每10秒的代码重复：

setInterval(function(){ 
    $.get('response.php', function(data) { //data is a JS object with two properties, firstDiv and secondDiv 
     $('#firstDiv').html(data.firstDiv); 
     $('#secondDiv').html(data.secondDiv); 
    }); 
}, 10000);

来源

2010-11-16 11:55:47 lonesomeday

这只是一个未经测试的想法，但不妨一试...

function update(){ 
    // all your defined classes which are .refreshingDivs will do the following 
    $('.refreshingDivs').each(function(){ 
     // foreach refreshingDiv, get their id attribute and send with request 
     // so that response.php knows what to do for each specific div 
     $.get('response.php?id=' + $(this).attr('id'), function(data){ 
      // place the returned data inside refreshingDiv children 
      // which has the .placeholder class 
      $(this).children('.placeholder').html(data); 
      window.setTimeout(update, 10000); 
     }); 
    }); 
} 
$(document).ready(function(){ 
    update(); 
});

如果你有控制器刷新Simon的方法似乎最适合你。

来源

2010-11-16 12:01:42 acm

我添加了一些问题得到这个工作，所以根据冉巴兹克的回答，我想出了以下似乎适用于我的问题。

$(document).ready(function(){ 
    var refreshId = setInterval(function(){ 
     update("#test", "/test.php"); 
    }, 30000); 
    $.ajaxSetup({ cache: false }); 

    update("#test", "/test.php"); 
}); 

function update(divId, fileId) 
{ 
    $.get(fileId, function(data){ 
    $(divId).html(data); 
    }); 
}

我现在有想法，如果这是对还是错，但它适用于我。

线

window.setTimeout(update, 10000);

冉酒吧-ZIK的回答只是不想为我工作，不知道为什么。初始加载工作，但刷新没有，所以我修改了上面的代码以使其工作。

来源

2014-09-02 01:54:59 mattauckland

使用Jquery自动刷新多个div

回答

相关问题