Javascript 使用javascript自动刷新div
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/10790110/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Autorefresh div with javascript
提问by Sherif
I have been looking around for the simplest way to refresh a particular div on my page, automatically, every x seconds.
我一直在寻找最简单的方法来刷新我页面上的特定 div,每 x 秒自动刷新一次。
So far I've got:
到目前为止,我有:
<script type="text/javascript">
window.onload = startInterval;
function startInterval()
{
setInterval("startTime();",1000);
}
function startTime()
{
document.getElementById('time').innerHTML = Date();
}
However the last part where the innerHTML is set to the date function is what I'd like replaced by the content of the "time" ID, and not an actual date print.
然而,将innerHTML 设置为日期函数的最后一部分是我想要替换为“时间”ID 的内容,而不是实际的日期打印。
I know I could load an iframe, or externa html page, but I would like to simply call upon an existing div on the page instead of having to change the existing content. Is that possible?
我知道我可以加载 iframe 或 externa html 页面,但我只想调用页面上的现有 div,而不必更改现有内容。那可能吗?
Thanks!
谢谢!
Edit: What I mean is I have a a div that looks like this on the page:
编辑:我的意思是我在页面上有一个看起来像这样的 div:
一些东西I would like to have that div refreshed every x seconds, so yes, you may ignore the Date() part of my example, I simply found that code as is but when I tried to remove the .innerHTML part it just does nothing, I think lol!
我希望该 div 每 x 秒刷新一次,所以是的,您可以忽略我示例中的 Date() 部分,我只是按原样找到了该代码,但是当我尝试删除 .innerHTML 部分时,它什么也没做,我想想哈哈!
采纳答案by Jared Farrish
NOTE:The OP is actually wanting to reload a script in an ad service already included on the page. The following does not help with this; however, due to the way the question was asked, I'm leaving this answer since I think it could help others looking for the following type of solution. Just be aware this does not demonstrate how to "rerun" already included (presumably global and non-function'd) code.
注意:OP 实际上是想在页面上已经包含的广告服务中重新加载脚本。以下内容对此没有帮助;但是,由于提出问题的方式,我将留下这个答案,因为我认为它可以帮助其他人寻找以下类型的解决方案。请注意,这并没有演示如何“重新运行”已经包含的(大概是全局的和非函数的)代码。
Say I have the following div
I'd like to dynamically refresh:
假设我有以下div
我想动态刷新:
<div id="refresh">Refreshes...</div>
jQuery offers the $.ajax
group of functionsthat allow you to dynamically request a page and use the response as HTML. For instance:
jQuery 提供了一$.ajax
组函数,允许您动态请求页面并将响应作为 HTML 使用。例如:
$(document).ready(function(){
var $refresh = $('#refresh'),
loaded = 1,
data = {
html: $.toJSON({
text: 'some text',
object: {}
}),
delay: 3
};
var refresh = function(){
$.ajax({
url: "/echo/html/",
data: data,
type: "GET",
success: function(response) {
$refresh.html($refresh.html() + '<br/>#' + loaded);
loaded++;
setTimeout(refresh, 3000);
}
});
};
refresh();
});
Note, I'm using jsFiddle's echo/html/
functionality here as well. The data
variable is tuned to working with this for demonstration purposes. In reality, the data
sent with the request is either GET
or POST
variables like you work with normally. Also, I don'tuse response
in success
, but that's because it doesn't return anything in jsFiddle's demo mode.
注意,我在echo/html/
这里也使用了 jsFiddle 的功能。data
出于演示目的,该变量已调整为与此一起使用。实际上,data
与请求一起发送的是GET
或POST
变量,就像您通常使用的那样。另外,我不使用response
in success
,但那是因为它在 jsFiddle 的演示模式下不返回任何内容。
jQuery make's this stuff pretty easy. Really, I'd think about using it instead of most other approaches (requirements notwithstanding).
jQuery 让这些东西变得非常简单。真的,我会考虑使用它而不是大多数其他方法(尽管有要求)。
回答by Elliot Bonneville
Are you looking for something like this?
你在寻找这样的东西吗?
<script type="text/javascript">
window.onload = startInterval;
function startInterval() {
setInterval("startTime();",1000);
}
function startTime() {
var now = new Date();
document.getElementById('time').innerHTML = now.getHours() + ":" + now.getMinutes() + ":" +now.getSeconds();
}
</script>