Вопрос по javascript – Как заставить Javascript автоматически обновлять время

3

Я использую следующий код 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>
Какое это имеет отношение к PHP? Sietse

Ваш Ответ

7   ответов
-1


function timer(){
 var currentTime = new Date()
var hours = currentTime.getHours()
var minutes = currentTime.getMinutes()
var sec = currentTime.getSeconds()
if (minutes < 10){
    minutes = "0" + minutes
}
if (sec < 10){
    sec = "0" + sec
}
var t_str = hours + ":" + minutes + ":" + sec + " ";
if(hours > 11){
    t_str += "PM";
} else {
   t_str += "AM";
}
 document.getElementById('time_span').innerHTML = t_str;
 setTimeout(timer,1000);
}
<header>
<h2>Time<span id="time_span"></span></h2>
</header>

1

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);
И еще одна вещь, которую я был вынужден заявить в отдельном комментарии из-за ограничения символов, перерегистрация функции только добавила бы сложности в код (хотя его едва ли есть, хе-хе). Итак, как я уже говорил ранее, отчасти инстинкт, отчасти сложность кода заставили меня предпочесть setInterval.
избежатьsetInterval: weblogs.asp.net/bleroy/archive/2009/05/14/…
Пожалуйста, напишите полную вещь. Название было «setinterval - (умеренно) зло». Я прочитал всю статью. Единственный существенный отрицательный момент, о котором говорилось, касался отладки, что вовсе не является серьезной проблемой, если вы используете «Перешагнуть». функциональность отладчика. Во-вторых, я использовал setInterval, потому что он выполняется nomatter независимо от того, был ли выполнен предыдущий вызов или нет, и так как это было около часов, предыдущие вызовы не имеют значения. На самом деле setTimeout здесь прекрасно работает, просто интуиция заставила меня использовать setInterval.
Я убежден, что заменить setInterval на setTimeout очень просто, но я не убежден в том, чтобы просто поставить метку «EVIL». на setInterval - по крайней мере, в этом случае. Я согласен, что использование этого в игровых циклах или около того может быть грязным, в основном это будет происходить, но в чем-то столь же простом, как часы, я не думаю, что это что-то делает неправильно, что сказать? Кстати, разве мы не обсуждаем что-то глупое? :) Вы против setInterval, я за него, а автор вопроса рад, поскольку нашел свое решение - смешная ситуация, нет? хе-хе
Он @Parth, все зависит от вас, чтобы использоватьsetInterval или нет. Просто хотел указать вам на некоторые недостатки. Автор резюмирует:replacing setInterval with setTimeout is easy, pain-free and removes the inconveniences of setInterval. So while the setInterval evil is about at the level of not replacing the cap of the toothpaste, the non-evil alternative is so easy that I can’t see a reason not to forget about setInterval for good.
0

timer();

function timer(){
 var now     = new Date,
     hours   = now.getHours(),
     ampm    = hours<12 ? ' AM' : ' PM',
     minutes = now.getMinutes(),
     seconds = now.getSeconds(),
     t_str   = [hours-12, //otherwise: what's the use of AM/PM?
                (minutes < 10 ? "0" + minutes : minutes),
                (seconds < 10 ? "0" + seconds : seconds)]
                 .join(':') + ampm;
 document.getElementById('time_span').innerHTML = t_str;
 setTimeout(timer,1000);
}

Таймер обновляется (примерно) каждую секунду (= 1000 мс), используяsetTimeout из функции таймера.

& # x200B; ПосмотретьВ бою

1

updateClock() помещен в<head> раздел вашей страницы, и измените<body> пометить таким образом:

<body onload="updateClock(); setInterval('updateClock()', 1000 )">

Он будет пересчитывать и отображать время каждую секунду. Поскольку вы отображаете только часы и минуты, вы можете использовать более длительный интервал. Если вы хотите обновить время каждыйnumSeconds вы должны использовать что-то вроде

<body onload="updateClock(); setInterval('updateClock()', numSeconds * 1000 )">

И, конечно же, это только одно из многих решений, которые вы можете найтитам.

11

SetTimeout (..) вызывать функцию через определенное время. В этом конкретном случае лучше использоватьsetInterval (..)

function updateTime(){
    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;
}
setInterval(updateTime, 1000);
1

проверьте этот предыдущий пост:Как создать таймер JQuery Clock

0

00: 00: 00 и обновляется автоматически, как часы реального времени, надеюсь, это сработает.

function r(txt) {
    document.write(tex);
}

function createTIME() {
    d = new Date();
    var time = addZERO(d.getHours()) + ':' + addZERO(d.getMinutes()) + ':' + addZERO(d.getSeconds());
    return 'Present Time = ' + time;
}

function doDyn() {
    document.getElementById('Dyn').innerHTML = createTIME();
}

function addZERO(val) {
    return ((val < 10) ? '0' : '') + val;
}
дать некоторые объяснения.

Похожие вопросы