как создать отсчет JavaScript, который при обновлении продолжает считать - PullRequest
Новая
       11

как создать отсчет JavaScript, который при обновлении продолжает считать

2 голосов
/ 11 декабря 2011

Я пробую это с javascript и jquery, но не знаю, как это сделать.я не позволю таймеру не начать обновлять счет снова.Это то же самое, что аукцион, когда он отсчитывает 3,2 и после обновления он не начинает снова, он должен продолжать отсчитывать, где он в последний раз закончился.И на других продуктах это должно рассчитывать от 3 снова.У кого-нибудь есть идеи?

Редактировать: , потому что некоторые пользователи неправильно поняли, что я ищу.

Моя проблема в том, что я не знаю, как сэкономить время, когдакто-то обновил страницу, чтобы продолжить считать.если кто-то обновит сайт в 21сек, и у него будет 30 секунд, чтобы сделать выбор.и после обновления сайта счетчик будет отсчитывать при 21 секунде и не запускаться снова через 30 секунд.нет AJAX.

По возможности жестко закодировано.И если это невозможно, тогда вариант cookie.

Ответы [ 3 ]

3 голосов
/ 11 декабря 2011

Вы можете установить имя для вашего окна при загрузке страницы.Перед установкой имени проверьте, есть ли у этого окна имя.

если у него нет имени, присвойте окну имя, начните отсчет с 0 и сохраняйте значение счетчика в файле cookie при каждом увеличении.

, если оно имеетname (это означает, что страница перезагружается), прочитайте значение счетчика из файла cookie, сделайте приращение и сохраните в файл cookie.

EDIT : Пример, вызов функции initCount () при загрузке тела.Используйте функцию decmentAndSave, чтобы уменьшить значение счетчика и сохранить его в файле cookie. 

var count = 3;// 3 -> 2 -> 1

function getCookie(c_name) {
    var i, x, y, ARRcookies = document.cookie.split(";");
    for (i = 0; i < ARRcookies.length; i++) {
        x = ARRcookies[i].substr(0, ARRcookies[i].indexOf("="));
        y = ARRcookies[i].substr(ARRcookies[i].indexOf("=") + 1);
        x = x.replace(/^\s+|\s+$/g, "");
        if (x == c_name) {
            return unescape(y);
        }
    }
}

function setCookie(c_name, value, exdays) {
    var exdate = new Date();
    exdate.setDate(exdate.getDate() + exdays);
    var c_value = escape(value) + ((exdays == null) ? "" : "; expires=" + exdate.toUTCString());
    document.cookie = c_name + "=" + c_value;
}

function initCount() {
    if (window.name) {
        count = getCookie("count_" + window.name);// to keep separate count cookies for each window    
    } else {
        window.name = "w_" + (new Date().getTime());
        count = 3;
        setCookie("count_" + window.name, count, null);
    }
}

function decrementAndSave() {
    count--;
    // separate cookie for each window or tab
    setCookie("count_" + window.name, count, null);
}
1 голос
/ 21 сентября 2012

Это не идеально, но я разработал этот скрипт для 30-минутного обратного отсчета, а затем для изменения текста в течение последних нескольких секунд.Единственная проблема с ним состоит в том, что когда он достигает 1:00, он начинается в 30:60, и я еще не выяснил, как это исправить.Это может не сработать идеально для того, что вы ищете, но может поставить вас на правильный путь.

<script>
//add leading zeros
setInterval(function() {
function addZero(i) {
    if (i < 10) {
        i = "0" + i;
    }
    return i;
}
var x = document.getElementById("timer");
var d = new Date();
var s = (d.getSeconds());
var m = (d.getMinutes());
var a = addZero(30 - m);
var b = addZero(60 - m);
var c = (60 - s);
var z = "<span style='color:red;font-size:50px;'>" + "Break" + "</span>";
var v = "<span style='color:black;font-size:24px;'>" + "Break" + "</span>";
//Decide how much should be subtracted from the time
if (m > 30) {
    y = b;
}
else if (m < 30) {
    y = a;
}
//elements for changing text
if (y < 2 && c < 15) {
    q = z;
}
else {
    q = v;
}

var t = y + (":" + addZero(c) + " Till Station " + (q));
x.innerHTML = t;
}, 250);
</script>


<div align="center" id="timer" style='color:black;font-size:24px;' ></div>
0 голосов
/ 11 декабря 2011

Если у вас есть обратный отсчет, тогда вы должны определить какое-то время окончания.Поэтому вместо обратного отсчета и простого вычитания 1 каждую секунду попробуйте что-то вроде этого: 

var endTime = new Date(2011,11,13,0,0,0); // Midnight of December 13th 2011
var timer = setInterval(function() {
    var now = new Date();
    var timeleft = Math.max(0,Math.floor((endTime.getTime()-now.getTime())/1000));

    var d, h, m, s;
    s = timeleft % 60;
    timeleft = Math.floor(timeleft/60);
    m = timeleft % 60;
    timeleft = Math.floor(timeleft/60);
    h = timeleft % 24;
    timeleft = Math.floor(timeleft/24);
    d = timeleft;

    document.getElementById('counter').innerHTML = "Time left: "+d+" days, "+h+" hours, "+m+" minutes, "+s+" seconds.";

    if( timeleft == 0) clearInterval(timer);
},1000);
...