0 / 0 / 0
Регистрация: 07.01.2017
Сообщений: 22
1

Таймер, который считает вперед

25.09.2018, 14:51. Показов 3351. Ответов 13
Метки нет (Все метки)

Добрый день!

Помогите создать таймер, который будет делать счет вперед.

Условия кода:

Указываем дату. Например: 2018,9,24
С этой даты скрипт сравнивает время сейчас и то значение, что указано изначально и выдает результат:
Прошло 5 дней 3 часа 20 минут 30 секунд

Результат обновляется каждую секунду.
При обновлении страницы не сбрасывается.
0
Programming
Эксперт
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
25.09.2018, 14:51
Ответы с готовыми решениями:

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

Cделать таймер, который бесконечно идёт вперёд, и не сбрасывается при перезагрузке страницы
Помогите. Как сделать таймер, который бесконечно идёт вперёд, и не сбрасывается при перезагрузке...

Скрипт на javascript, который считает цену от доллара
Кто знает как сделать скрипт на javascript, который учитывая текущий курс доллара высчитывает...

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

13
392 / 294 / 121
Регистрация: 26.08.2016
Сообщений: 902
25.09.2018, 17:02 2
С радостью поможем. Что именно у вас не получается? В чем именно нужна помощь?
0
0 / 0 / 0
Регистрация: 07.01.2017
Сообщений: 22
25.09.2018, 17:14  [ТС] 3
Javascript
1
2
3
4
5
6
7
8
<script>
 
d0 = new Date(2018,8,20);
d1 = new Date(2018,9,20);
dt = (d1.getTime() - d0.getTime()) / (1000*60*60*24);
document.write('Прошло ' + '<strong>' + Math.round(dt) + '</strong> ' + 'дней');
 
</script>
Хочу автоматизировать, чтобы сравнение было с серверным временем и выдачей результата после сравнения.

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

И еще подсказку от вас как сделать счет с точностью до секунд: 5 дн 4 ч 20 мин 30 сек
0
392 / 294 / 121
Регистрация: 26.08.2016
Сообщений: 902
25.09.2018, 18:05 4
remaine, С сервера посылаете странице текущее серверное время и дату отсчета, например на PHP это будет выглядеть так:

PHP/HTML
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
<?php
$dateStart = '2018-08-20';
$dateCurrent = date('Y-m-d H:i:s');
?>
 
<script>
    var serverDateCurrent = new Date('<?php $dateStart ?>');
    var serverDateStart = new Date('<?php $dateCurrent ?>');
 
    var serverDiff = Math.ceil(serverDateCurrent.getTime() - serverDateStart.getTime());
 
    //Лучше запомнить текущее время чтобы не полагаться на точность setInterval
    var localStart = performance.now();
 
    var countDiff = function() {
 
        var diff = Math.ceil(performance.now() - localStart + serverDiff);
 
        var res = [
            ['дн', 1000 * 60 * 60 * 24],
            ['ч', 1000 * 60 * 60],
            ['мин', 1000 * 60],
            ['сек', 1000],
        ].reduce((res, v) => {
            var part = Math.ceil(diff / v[1]);
            if(part) {
                res += ' ' + part + ' ' + v[0];
                diff = diff % v[1];
            }
 
            return res;
        }, 'Прошло');
 
        document.write(res); //Здесь нужно будет выводить в статичный элемент
    };
 
    setInterval(countDiff, 1000);
 
</script>
1
0 / 0 / 0
Регистрация: 07.01.2017
Сообщений: 22
25.09.2018, 18:13  [ТС] 5
Цитата Сообщение от renat_dmitriev Посмотреть сообщение
<?php
$dateStart = '2018-08-20';
$dateCurrent = date('Y-m-d H:i:s');
?>
У меня сайт php не обрабатывает...

портал на sharepoint и я могу только js использовать. Можно выводить серверное время без php?
0
392 / 294 / 121
Регистрация: 26.08.2016
Сообщений: 902
25.09.2018, 18:24 6
remaine, Думаю что нет, потому что js отрабатывает на клиенте, сервер ничего о нем не знает, а по https сервер по умолчанию вроде бы время не передает.

Добавлено через 4 минуты
Хотя возможно есть какой-то сервис, выдающий точное время в нужном часовом поясе. И можно считывать время с него, если у сервера не какое-то суперспецифичное.
0
0 / 0 / 0
Регистрация: 07.01.2017
Сообщений: 22
25.09.2018, 18:33  [ТС] 7
renat_dmitriev, Хорошо, понятно...
А если не заморачиваться с серверным временем и просто каждые 24 часа прибавлять единицу?
0
392 / 294 / 121
Регистрация: 26.08.2016
Сообщений: 902
25.09.2018, 18:41 8
remaine, Куда и где прибавлять единицу каждые 24 часа?
0
0 / 0 / 0
Регистрация: 07.01.2017
Сообщений: 22
25.09.2018, 18:53  [ТС] 9
renat_dmitriev,
Я на своем примере покажу:

new Date(2018,9,25); - от сегодняшнего дня начинаем бесконечно прибавлять единицу каждые 24 часа.
Наверное, такой отсчет подходит: 1000*60*60*24

И выводим результат в строку document.write('Прошло ' + '<strong>' + Math.round(dt) + '</strong> ' + 'дней');

Я не могу додуматься как отсчитывать эти самые 24 часа.
0
392 / 294 / 121
Регистрация: 26.08.2016
Сообщений: 902
25.09.2018, 18:57 10
remaine, Если ваш скрипт не знает сколько времени на сервере, к чему вы собрались прибавлять единицу? Вам нужно узнать сколько времени на сервере, иначе вся логика теряется.
0
║XLR8║
1212 / 909 / 270
Регистрация: 25.07.2009
Сообщений: 4,361
Записей в блоге: 5
25.09.2018, 22:20 11
remaine, renat_dmitriev, вы можете описать условие задачи а не её решения? Что должен получить пользователь в итоге, какой функционал?
0
0 / 0 / 0
Регистрация: 07.01.2017
Сообщений: 22
26.09.2018, 15:12  [ТС] 12
outoftime Пользователь должен при заходе на страницу видеть сколько дней прошло с такой-то даты.
Например, я установил в скрипте дату 25.09.2018. Пользователь зашел через 5 дней и видит блок, в котором написано:
С 25.09.2018 прошло 5 дней. Зашел пользователь через 2 дня: С 25.09.2018 прошло 7 дней.
Т.е. каждый день прибавляется 1 день к значению. Произошло какое-то событие, в скрипте поменяли дату на 30.09.2018 - пошел отсчет от этой даты таким же способом.

Добавлено через 1 час 51 минуту
HTML5
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
<style>
    html,
    body {
      margin: 0;
      padding: 0;
    }
 
    #header {
      text-align: center;
      font-size: 20px;
      width: 100%;
      height: 50px;
      line-height: 50px;
      background: white;
      border-bottom: 1px solid black;
    }
 
    #content {
      text-align: center;
      top: 25px;
      position: absolute;
      overflow: auto;
      line-height: 25px;
    }
 
  </style>
 
<div id="header">
      <span id="counter1"><strong>16</strong> дней </span>
</div>
<div id="content"></div>
 
<script>
function Counter(initDate, id){
    this.counterDate = new Date(initDate);
    this.countainer = document.getElementById(id);
    this.numOfDays = [ 31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31 ];
    this.borrowed = 0, this.years = 0, this.months = 0, this.days = 0;
    this.hours = 0, this.minutes = 0, this.seconds = 0;
    this.updateNumOfDays();
    this.updateCounter();
}
 
Counter.prototype.updateNumOfDays=function(){
    var dateNow = new Date();
    var currYear = dateNow.getFullYear();
    if ( (currYear % 4 == 0 && currYear % 100 != 0 ) || currYear % 400 == 0 ) {
        this.numOfDays[1] = 29;
    }
    var self = this;
    setTimeout(function(){self.updateNumOfDays();}, (new Date((currYear+1), 1, 2) - dateNow));
}
 
Counter.prototype.datePartDiff=function(then, now, MAX){
    var diff = now - then - this.borrowed;
    this.borrowed = 0;
    if ( diff > -1 ) return diff;
    this.borrowed = 1;
    return (MAX + diff);
}
 
Counter.prototype.calculate=function(){
    var futureDate = this.counterDate > new Date()? this.counterDate : new Date();
    var pastDate = this.counterDate == futureDate? new Date() : this.counterDate;
    this.seconds = this.datePartDiff(pastDate.getSeconds(), futureDate.getSeconds(), 60);
    this.minutes = this.datePartDiff(pastDate.getMinutes(), futureDate.getMinutes(), 60);
    this.hours = this.datePartDiff(pastDate.getHours(), futureDate.getHours(), 24);
    this.days = this.datePartDiff(pastDate.getDate(), futureDate.getDate(), this.numOfDays[futureDate.getMonth()]);
    this.months = this.datePartDiff(pastDate.getMonth(), futureDate.getMonth(), 12);
    this.years = this.datePartDiff(pastDate.getFullYear(), futureDate.getFullYear(), 0);
}
 
Counter.prototype.addLeadingZero=function(value){
    return value < 10 ? ("0" + value) : value;
}
 
Counter.prototype.formatTime=function(){
    this.seconds = this.addLeadingZero(this.seconds);
    this.minutes = this.addLeadingZero(this.minutes);
    this.hours = this.addLeadingZero(this.hours);
}
 
Counter.prototype.updateCounter=function(){
    this.calculate();
    this.formatTime();
    this.countainer.innerHTML = "Прошел" + " <strong>" + this.days + "</strong> " + (this.days == 1? "день" : "дня");
    var self = this;
    setTimeout(function(){self.updateCounter();}, 1000);
}
</script>
 
<script type="text/javascript">
  new Counter('September 25, 2018 00:00:00', 'counter1');
  new Counter(((new Date()).getTime()+10000), 'counter2');
</script>
С отсчетом времени я разобрался.
0
║XLR8║
1212 / 909 / 270
Регистрация: 25.07.2009
Сообщений: 4,361
Записей в блоге: 5
26.09.2018, 18:56 13
Цитата Сообщение от remaine Посмотреть сообщение
Т.е. каждый день прибавляется 1 день к значению.
А если я сделаю тот же функционал ничего не прибавляя? Я же написал, не надо писать как что делать, опишите что именно сделать надо. Вы сами не знаете как это реализовать, но подобными условиями указываете как делать. Ну так сделайте сами, вы ведь знаете как.

remaine, А вообще, не стоит городить костыли. Пользуйтесь готовыми решениями, например date-diff. Тогда весь алгоритм работы: берем текущую дату, отнимаем он неё начальную дату и выводим разницу с интервалом в одну секунду.
1
0 / 0 / 0
Регистрация: 07.01.2017
Сообщений: 22
27.09.2018, 17:41  [ТС] 14
outoftime, понял, спасибо)
0
IT_Exp
Эксперт
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
27.09.2018, 17:41
Помогаю со студенческими работами здесь

Таймер считает не правильно
Здравствуйте. Столкнулся со следующей проблемой. Есть у меня график, который по таймеру...

Задача заключается в том чтобы заставить этот самолет двигаться вперед( как бы летать), но сделать это через таймер!
type TForm1 = class(TForm) procedure FormMouseDown(Sender: TObject; Button: TMouseButton; ...

Нарисовать автомобиль, который будет двигаться по командной кнопке (вперед и назад)
используя элементы управления типа share и line нарисовать автомобиль, который будет двигаться по...

Калькулятор, который считает расстояние
Добрый день. Прошу мне помочь. Есть такой вопрос. Как сделать так, чтобы php считал расстояние...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
14
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2023, CyberForum.ru