首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >如何使Javascript时间自动更新

如何使Javascript时间自动更新
EN

Stack Overflow用户
提问于 2012-05-06 21:20:09
回答 8查看 47.4K关注 0票数 3

我正在使用以下Javascript代码在我的网站上显示时间。如何自动进行此更新。

谢谢

代码语言:javascript
复制
<section class="portlet grid_6 leading"> 
<header>
<h2>Time<span id="time_span"></span></h2>
</header>
<script type="text/javascript">
var currentTime = new Date()
var hours = currentTime.getHours()
var minutes = currentTime.getMinutes()
if (minutes < 10){
    minutes = "0" + minutes
}
var t_str = hours + ":" + minutes + " ";
if(hours > 11){
    t_str += "PM";
} else {
   t_str += "AM";
}
document.getElementById('time_span').innerHTML = t_str;
</script>
</section>
EN

回答 8

Stack Overflow用户

发布于 2012-05-06 21:29:07

将所有javascript代码添加到一个名为updateClock()的函数中,该函数位于页面的<head>部分,并以这种方式更改<body>标记:

代码语言:javascript
复制
<body onload="updateClock(); setInterval('updateClock()', 1000 )">

它会每秒重新计算和重新显示时间。由于只显示小时和分钟,因此可以使用更长的时间间隔。如果你想更新每个numSeconds的时间,你应该使用类似这样的东西

代码语言:javascript
复制
<body onload="updateClock(); setInterval('updateClock()', numSeconds * 1000 )">

当然,这只是你可以找到的众多out there解决方案中的一个。

票数 2
EN

Stack Overflow用户

发布于 2012-05-06 21:25:24

外面有很多时钟库。也许可以看看之前的这篇文章:How to create a jquery clock timer

票数 1
EN

Stack Overflow用户

发布于 2012-05-06 21:28:25

试试这个,一个更整洁的版本:

代码语言:javascript
复制
var el = document.getElementById('time_span')
setInterval(function() {

    var currentTime = new Date(),
        hours = currentTime.getHours(),
        minutes = currentTime.getMinutes(),
        ampm = hours > 11 ? 'PM' : 'AM';

    hours += hours < 10 ? '0' : '';
    minutes += minutes < 10 ? '0' : '';

    el.innerHTML = hours + ":" + minutes + " " + ampm;
}, 1000);
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/10470825

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档