javascript периодический обратный отсчет - PullRequest
Новая
       2

javascript периодический обратный отсчет

0 голосов
/ 19 декабря 2011

У меня есть вопрос относительно таймера обратного отсчета. у меня есть код ниже, который отображает визуальный отсчет. моя проблема в том, что он сбрасывается каждый раз, когда я обновляю страницу, на стороне клиента. Есть ли способ сделать ниже серверную сторону и перезапустить, когда он достигнет нуля? 

<script>
    var interval;
    var minutes = 1;
    var seconds = 5;
    window.onload = function() {
        countdown('countdown');
    }

    function countdown(element) {
        interval = setInterval(function() {
            var el = document.getElementById(element);
            if(seconds == 0) {
                if(minutes == 0) {
                    el.innerHTML = "countdown's over!";                    
                    clearInterval(interval);
                    return;
                } else {
                    minutes--;
                    seconds = 60;
                }
            }
            if(minutes > 0) {
                var minute_text = minutes + (minutes > 1 ? ' minutes' : ' minute');
            } else {
                var minute_text = '';
            }
            var second_text = seconds > 1 ? 'seconds' : 'second';
            el.innerHTML = minute_text + ' ' + seconds + ' ' + second_text + ' remaining';
            seconds--;
        }, 1000);
    }
    </script>

<div id='countdown'></div>

вышеуказанный код можно найти здесь:
Javascript Обратный отсчет

Ответы [ 2 ]

0 голосов
/ 19 декабря 2011

Вы уверены, что счетчик должен быть на стороне сервера? Если вы просто хотите, чтобы обратный отсчет продолжался при обновлении браузера, вы можете использовать cookie 

// Setting cookie after every second, using the jQuery cookie plugin http://plugins.jquery.com/project/cookie
$.cookie("minutes", current_minutes_left);
$.cookie("seconds", current_seconds_left);

// Retrieve cookie later
$.cookie("minutes");
$.cookie("seconds");
// do something with the cookies

Это должно сделать это.

0 голосов
/ 19 декабря 2011

Просто установите 

var minutes = 1;
var seconds = 5;

серверным скриптом, основанным на времени окончания обратного отсчета.

Пример:

  1. Хранить дату и время окончания обратного отсчета на стороне сервера (сеанс PHP)
  2. Рассчитать время для обратного отсчета на основе сохраненного значения относительно смещения клиента (другой часовой пояс)
  3. Запись в вычисленные значения в виде значений JavaScript в выходном HTML

При перезагрузке просто пересчитайте время для обратного отсчета снова на основе сохраненного значения.

Вот и все!

...