Как сделать таймер на js с записью в local storage

@Fenix10032222 · Регистрация: 14.02.2022

Студворк — интернет-сервис помощи студентам

Добрый день. Возникла такая проблема: есть написанный на js таймер. Вопрос: как сделать так, чтобы он записывал значения в local storage и считал даже после закрытия вкладки и браузера? Очень многое, что попробовал, но так и не смог выполнить эту задачу. Также необходимо, чтобы при нажатии на кнопку STOP таймер записывал новые значения в local storage, чтобы при последующем запуске отсчет шел с того момента, где была нажата кнопка STOP. Заранее спасибо.

HTML5
1
2
3
4
5
6
7
8
9
            <div class="timer--duplicate">
                                    <div class="timer_items--duplicate">
                                        <div class="timer_item--duplicate timer_hours--duplicate-ferm1">00</div>
                                        <span class="timer_item-colon--duplicate">:</span>
                                        <div class="timer_item--duplicate timer_minutes--duplicate-ferm1">00</div>
                                        <span class="timer_item-colon--duplicate">:</span>
                                        <div class="timer_item--duplicate timer_seconds--duplicate-ferm1">00</div>
                                    </div>
            </div>

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
function ClearСlock(info_Ferm) {
    clearTimeout(info_Ferm.clocktimer);
    info_Ferm.h = 1;
    info_Ferm.m = 1;
    info_Ferm.tm = 1;
    info_Ferm.s = 0;
    info_Ferm.ts = 0;
    info_Ferm.ms = 0;
    info_Ferm.init = 0;
    info_Ferm.readout = '00:00:00';
    return info_Ferm;
}
 
 
function StartTIME(info_Ferm) {
    var cdateObj = new Date();
    function resetStartTime() {
        startTime = new Date();
        window.localStorage.setItem('cdateObj', cdateObj);
        return cdateObj;
      }
    let dh, dm, ds;
    var t = (cdateObj.getTime() - info_Ferm.dateObj.getTime()) - (info_Ferm.s * 1000);
    if (t > 999) {
        info_Ferm.s++;
    }
    if (info_Ferm.s >= (info_Ferm.m * info_Ferm.base)) {
        info_Ferm.ts = 0;
        info_Ferm.m++;
    } else {
        info_Ferm.ts = parseInt((info_Ferm.ms / 100) + info_Ferm.s);
        if (info_Ferm.ts >= info_Ferm.base) {
            info_Ferm.ts = info_Ferm.ts - ((info_Ferm.m - 1) * info_Ferm.base);
        }
    }
    if (info_Ferm.m > (info_Ferm.h * info_Ferm.base)) {
        info_Ferm.tm = 1;
        info_Ferm.h++;
    } else {
        info_Ferm.tm = parseInt((info_Ferm.ms / 100) + info_Ferm.m);
        if (info_Ferm.tm >= info_Ferm.base) {
            info_Ferm.tm = info_Ferm.tm - ((info_Ferm.h - 1) * info_Ferm.base);
        }
    }
    info_Ferm.ms = Math.round(t / 10);
    if (info_Ferm.ms > 99) {
        info_Ferm.ms = 0;
    }
    if (info_Ferm.ms == 0) {
        info_Ferm.ms = '00';
    }
    if (info_Ferm.ms > 0 && info_Ferm.ms <= 9) {
        info_Ferm.ms = '0' + info_Ferm.ms;
    }
    if (info_Ferm.ts > 0) {
        ds = info_Ferm.ts;
        if (info_Ferm.ts < 10) {
            ds = '0' + info_Ferm.ts;
        }
    } else {
        ds = '00';
    }
    dm = info_Ferm.tm - 1;
    if (dm > 0) {
        if (dm < 10) {
            dm = '0' + dm;
        }
    } else {
        dm = '00';
    }
    dh = info_Ferm.h - 1;
    if (dh > 0) {
        if (dh < 10) {
            dh = '0' + dh;
        }
    } else {
        dh = '00';
    }
 
    $(".timer_hours--duplicate-ferm" + info_Ferm.numTank).text(dh);
    $(".timer_minutes--duplicate-ferm" + info_Ferm.numTank).text(dm);
    $(".timer_seconds--duplicate-ferm" + info_Ferm.numTank).text(ds);
    
    info_Ferm.clocktimer = window.setInterval(function () {
        StartTIME(info_Ferm);
    }, 1000);
}
 
function StartStop(info_Ferm) {
    if (info_Ferm.init == 0) {
        let ferm = ClearСlock(info_Ferm);
        info_Ferm.dateObj = new Date();
        StartTIME(ferm);
        info_Ferm.init = 1;
}

@Balanaar · 18.02.2022, 10:12

Сообщение от Fenix10032222

и считал даже после закрытия вкладки и браузера?

Вот это требование выполнить невозможно, если речь идёт о браузерном JS. Все сценарии, естественно, прекратят свою работу после закрытия вкладки и, тем более, браузера. Иначе какой простор был бы для майнеров... ммм...

Новые блоги и статьи Все статьи Все блоги /
Воспроизведение звукового файла с помощью SDL3_mixer при касании экрана Android 8Observer8 26.01.2026 Содержание блога SDL3_mixer - это библиотека я для воспроизведения аудио. В отличие от инструкции по добавлению текста код по проигрыванию звука уже содержится в шаблоне примера. Нужно только. . .	Установка Android SDK, NDK, JDK, CMake и т.д. 8Observer8 25.01.2026 Содержание блога Перейдите по ссылке: https:/ / developer. android. com/ studio и в самом низу страницы кликните по архиву "commandlinetools-win-xxxxxx_latest. zip" Извлеките архив и вы увидите. . .	Вывод текста со шрифтом TTF на Android с помощью библиотеки SDL3_ttf 8Observer8 25.01.2026 Содержание блога Если у вас не установлены Android SDK, NDK, JDK, и т. д. то сделайте это по следующей инструкции: Установка Android SDK, NDK, JDK, CMake и т. д. Сборка примера Скачайте. . .	Использование SDL3-callbacks вместо функции main() на Android, Desktop и WebAssembly 8Observer8 24.01.2026 Содержание блога Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а. . .
моя боль iceja 24.01.2026 Выложила интерполяцию кубическими сплайнами www. iceja. net REST сервисы временно не работают, только через Web. Написала за 56 рабочих часов этот сайт с нуля. При помощи perplexity. ai PRO , при. . .	Модель сукцессии микоризы anaschu 24.01.2026 Решили писать научную статью с неким РОманом	http://iceja.net/ математические сервисы iceja 20.01.2026 Обновила свой сайт http:/ / iceja. net/ , приделала Fast Fourier Transform экстраполяцию сигналов. Однако предсказывает далеко не каждый сигнал (см ограничения http:/ / iceja. net/ fourier/ docs ). Также. . .	http://iceja.net/ сервер решения полиномов iceja 18.01.2026 Выкатила http:/ / iceja. net/ сервер решения полиномов (находит действительные корни полиномов методом Штурма). На сайте документация по API, но скажу прямо VPS слабенький и 200 000 полиномов. . .