Запустить таймер при клике на кнопку

@zFARTz · Регистрация: 06.07.2015

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

Всем доброго дня нашёл таймер всё работает как нужно. Но есть проблемка. Как сделать чтобы он запускался от кнопки. Останавливался когда время закончиться и снова нажимаешь опять пошёл отсчёт. И есть ли возможность сделать чтобы кнопка была в одном месте а таймер абсолютно в другом. Но если нет так нет. Вот таймер. Всем спасибо.

HTML5
1
<span id="mT">00:00:10</span>

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
t = setInterval (function() {
    var s = document.getElementById ('mT'),
    f = function (x) {
        return (x / 100).toFixed (2).substr (2)
    }, 
    d = ':',
    y = s.innerHTML.split (d), 
    z = --y [2] + y [0] * 3.6e3 + y [1] * 60;
 
    if (!z) clearInterval (t); 
    s.innerHTML = [
        f (Math.floor (z / 3600)),
        f (Math.floor (z % 3600 / 60)), 
        f (z % 3600 % 60)
    ].join (d);
}, 1000);

@kalabuni · 22.12.2017, 13:05

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

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

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

и это получатся уже не просто "таймеры обратного отсчёта", а что-то иное, не знаю даже как и назвать

но сделать -- не проблема, просто надо точно поставить задачу

@77227755 · 22.12.2017, 13:10

Та да, синхронизация времени с ресурсом необязательна +- 30секунд погоды не делают, таймер чисто для удобства юзера, но возникает другой вопрос нагрузки на сайт...скорее всего прийдеться отказаться от этой идеи...более 100 таймеров которые синхронизируются по времени с временем сайта (при обновлении страницы должны не сбрасываться)...еще одного или десяток юзеров выдержат, но если повезет зайдет 100 человек одновременно-ляжет сайт...или как?

@kalabuni · 22.12.2017, 14:46

77227755, речь идёт о странице, а не о сайте, перестаньте употреблять "умные" слова, не понимая их значений, очень глупо выглядите

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

Добавлено через 3 минуты
и да, название для "таймера с синхронизацией", наверное, придумывать не надо, оно уже есть -- это будильник

@Balanaar · 22.12.2017, 16:36

77227755, а что там с нагрузкой на сервер будет? Какая разница сколько там таймеров? На клиенте храните время запуска таймеров по отдельности на каждый, а с сервера получайте текущее время сервера. Дальше средствами клиентского JS выставляйте нужное время в зависимости от разницы между временем запуска и текущим серверным. Нагрузка на сервер кроме однократного запроса времени полностью отсутствует.

Добавлено через 1 минуту
Периодически конечно надо синхронизировать таймеры для точности. Зависит от частоты синхронизации. Раз в 3-5 минут опять же погоды не сыграют на нагрузке.

@kalabuni · 23.12.2017, 06:24

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

Периодически конечно надо синхронизировать таймеры для точности. Зависит от частоты синхронизации. Раз в 3-5 минут опять же погоды не сыграют на нагрузке.

Balanaar, ведь вы же умеете "включать голову", вчера доказали это здесь же, на форуме

какая на фиг "периодическая синхронизация"?
с чем именно вы собрались синхронизировать серверное время?

Код таймера, приведённый в топовом сообщении, вовсе не работает с объектом Date ()
Там использован метод setInterval () и 1000 миллисекунд в качестве таймаута для него -- я знаю, о чём пишу, ибо я автор этого говнокода (см. первоисточник)

Не по теме:

и чтобы было окончательно понятно
учительница нарисовала мелом на доске 20-ть чёрточек, вот так: ||||||||||||||||||||
и предложила Вовочке отсчитывать в уме "про себя" по 60-т секунд, и по истечении каждой такой "минуты" стирать тряпкой с доски одну чёрточку справа, и, взглянув на свои наручные часы, пообещала, что примерно в тот момент, когда Вовочка закончит свою работу "таймером обратного отсчёта" и сотрёт последнюю чёрточку, как раз и прозвенит звонок на переменку.

Вовочка исправно считал и стирал чёрточки
Когда на доске осталось всего 10-ть чёрточек,, вот так: |||||||||| в классе вдруг погас свет.
Дети зашумели, но учительница быстро навела порядок, объяснив им, что это она специально выключила свет, чтобы продемонстрировать" обновление страницы", и пообещала вскоре включить свет обратно
Когда свет в классе зажёгся, то на доске были всё те же 10-ть чёрточек, вот так: ||||||||||

Вовочке учительницей было предложено продолжить отсчитывать минуты и стирать чёрточки
И Вовочка снова начал свою "работу"
И когда на доске осталось всего три чёрточки, вот так: |||, прозвенел звонок об окончании урока.
Не давая детям убежать на переменку, учительница объяснила, что три оставшиеся чёрточки -- это как раз то время, которое прошло при "обновлении страницы" (когда в классе не было света).

@Balanaar · 25.12.2017, 10:39

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

с чем именно вы собрались синхронизировать серверное время?

Синхронизировать следует время на странице в браузере, потому что setInterval() не гарантирует срабатывание обработчика строго миллисекунда в миллисекунду. Он лишь гарантирует, что обработчик выполнится не раньше заданного времени. Соответственно если страница будет долго открыта с работающими таймерами без обновления страницы - таймеры начнут отставать. Чем дольше страница будет открыта - тем сильнее будет отставание. Поэтому периодически стоит сверять время с сервером.

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

Код таймера, приведённый в топовом сообщении, вовсе не работает с объектом Date ()

Честно признаться, весь тред не читал. Также не вникал в код в посте ТСа, потому что написан он 2 года назад и вряд ли актуален для того, кому я на самом деле ответил.

@kalabuni · 25.12.2017, 13:03

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

Синхронизировать следует время на странице в браузере, потому что setInterval() не гарантирует срабатывание обработчика строго миллисекунда в миллисекунду.

ну так нет же на странице времени, совсем нет!
но вы всё равно хотите это несуществующее время синхронизировать

@kalabuni · 22.05.2018, 02:28

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

Что делают эти два минуса?

уменьшают y [2] на единицу и возвращают полученное значение, называется это дело префиксным декрементом

Новые блоги и статьи Все статьи Все блоги /
Из невошедшего на форум (диалог с ИИ-гугла) zorxor 29.07.2026 А вот, что интересно, сказал мне ИИ-гугла: Этот текст — эмоциональный пост пользователя под ником zorxor на интернет-форуме (вероятно, посвященном мистике, непознанному или альтернативной науке). . . .	Был праздник вчера, а я и не знал. kumehtar 28.07.2026 27. 07. 2026г. Intel Core 2 Duo исполнилось 20 лет Новости компьютерного мира и их обсуждение (4) Салют, шампанское, овации! :drink:	Нейтральные знания, чистый код - бла-бла-бла-бла, на самом деле кликбейт и самореклама, плагиат, и вот почему Hrethgir 27.07.2026 То-есть отклонение такой публикации говорит само за себя, и пусть только возьмут на вооружение после отклонения публикации - это будет чистейшим актом плагиата. Отклонял Хабр. Дословно, отклонённая. . .	тв 16 бой ии anaschu 27.07.2026 Великий Перелом ИИ: Как уравнения ОДУ Radau дожали цензурные фильтры Алисы Фиксируем в мемофонде Теории Всего беспрецедентный факт в истории ИИ-зондирования. В затяжном многораундовом. . .
мв 15. непроверенное, возможно, глюк anaschu 27.07.2026 НАУЧНО-АНАЛИТИЧЕСКИЙ ОТЧЕТ. РАЗДЕЛ 1. 1: «НАУКА» (РАСШИРЕННАЯ СТЕХИОМЕТРИЧЕСКАЯ И ГЕНЕТИЧЕСКАЯ ВЕРСИЯ)Тема: Теоретическое обоснование инвариантности 19-мерного тензорного ядра непрерывных ОДУ и. . .	Очистка реквизитов и табличных частей документа при копировании (вариант 2) Maks 26.07.2026 Алгоритм из решения ниже разработан на примере нетипового документа "ЗаявкаНаРаботу", разработанного в КА2. Задача: Заменить алгоритм запрета копирования документов для сотрудников с ролью "Стажер",. . .	Доктрина интенционального знания - Доктрина для портала "Срез". Hrethgir 25.07.2026 Может найдётся кто захочет оценить доктрину. . . Написания правил участия для меня роскошь, требующая лимита времени, поэтому все сообщения не прошедшие модерацию будут видны только участникам портала,. . .	сукцессия 44. Решил подать на припринт в межународные сервисы препринтов. Но нужно одобрение от ученых anaschu 25.07.2026 Английский вариант. Пока кто то не одобрит мою личность, мне не получиться это опубликовать на препринте. Но заявку на публикацию статьи я сегодня подам.

@77227755 0 / 0 / 0 Регистрация: 24.11.2017 Сообщений: 5
	22.12.2017, 13:10
	Та да, синхронизация времени с ресурсом необязательна +- 30секунд погоды не делают, таймер чисто для удобства юзера, но возникает другой вопрос нагрузки на сайт...скорее всего прийдеться отказаться от этой идеи...более 100 таймеров которые синхронизируются по времени с временем сайта (при обновлении страницы должны не сбрасываться)...еще одного или десяток юзеров выдержат, но если повезет зайдет 100 человек одновременно-ляжет сайт...или как? 0

@kalabuni супермизантроп 3941 / 2979 / 692 Регистрация: 18.04.2012 Сообщений: 8,629
	22.12.2017, 14:46
	77227755, речь идёт о странице, а не о сайте, перестаньте употреблять "умные" слова, не понимая их значений, очень глупо выглядите сайт -- это десятки, сотни, тысячи, а то и миллионы страниц и файлов на одном доменном имени (как изначально загруженные на хостинг, так и динамически формируемые какими-то серверными средствами). Добавлено через 3 минуты и да, название для "таймера с синхронизацией", наверное, придумывать не надо, оно уже есть -- это будильник 0

@Balanaar 2463 / 1769 / 625 Регистрация: 11.07.2016 Сообщений: 4,067
	22.12.2017, 16:36
	77227755, а что там с нагрузкой на сервер будет? Какая разница сколько там таймеров? На клиенте храните время запуска таймеров по отдельности на каждый, а с сервера получайте текущее время сервера. Дальше средствами клиентского JS выставляйте нужное время в зависимости от разницы между временем запуска и текущим серверным. Нагрузка на сервер кроме однократного запроса времени полностью отсутствует. Добавлено через 1 минуту Периодически конечно надо синхронизировать таймеры для точности. Зависит от частоты синхронизации. Раз в 3-5 минут опять же погоды не сыграют на нагрузке. 0