Таймер обратного отсчета

@dalus · Регистрация: 31.08.2018

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

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

То есть юзер нажимает кнопку после чего показывает до следующего действия осталось "время" у меня все это получилось, но проблема моя в том что отсчета времени не идет, только когда обновляю страницу тогда идет, почему так? прошу прощение если не понятно объяснил я новичок !

@andyyy · 31.08.2018, 15:47

нужен javascript

@00Danik · 01.09.2018, 11:45

dalus,

JavaScript
1
2
3
4
5
6
7
8
9
10
11
function timer(){
 var obj=document.getElementById('timer_inp');
 obj.innerHTML--;
 
 if(obj.innerHTML==0){
     location = 'http://site.ru/';
     setTimeout(function(){},1000);
     }
 else{setTimeout(timer,1000);}
}
setTimeout(timer,1000);

HTML5
1
2
3
Этот сайт переехал!
<br><div style="float:left; margin-right:5px;">Через <b></div>&nbsp;<div id="timer_inp" style="float:left;">3</div>&nbsp;<div style="float:left; margin-left:5px;"></b> секунди произойдет автоматическое перенаправление на новый сайт.</div><br>
Если этого не произошло, то нажмите <a href="http://site.ru/">здесь!</a>';

@dalus · 01.09.2018, 13:55 **[ТС]**

00Danik,

echo'<td><div align="center"><div>Осталось <b></div> '.date('i:s', ($hach['time_h']-time()).' </b></font> </font></td>';

'.date('i:s', ($hach['time_h']-time()) ).'

Вот код в php файле. что нужно дописать что бы шел обратный отсчет?

+ подключить javascript буду очень благодарен

выше написанного сделал я так: подключил javascript и прописал так:

echo'<td><div align="center"><div>Осталось <b></div><div id="timer_inp"> '.date('i:s', ($hach['time_h']-time()).' </div></b></font> </font></td>';

После чего сработал обратный отсчет но вывод цифр написано NaN

@dalus · 01.09.2018, 13:56 **[ТС]**

Не помогло

@dalus · 01.09.2018, 14:01 **[ТС]**

Мой php код
echo'<td><div>Осталось <b></div> '.date('i:s', ($has['time_h']-time())).'</font> </font></b></td>';

этот код отвечает за время

'.date('i:s', ($has['time_h']-time())).'

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

выше скинутый код попробовал я

подключил javascript

в php файле прописал следующее

echo'<td><div>Осталось <b></div><div id="timer_inp"> '.date('i:s', ($has['time_h']-time())).'</div></font> </font></b></td>';

после чего обратный отсчет показал NaN

что я сделал не так?

@00Danik · 01.09.2018, 15:06

dalus,
Мой код рассчитан только на секунды, а вам нужно еще с минутами.
Пробуйте этот код (обратите внимание что код будет работать только в файле с расширением PHP):

PHP
1
2
3
4
//дату нужно перевести в секунды для js
$time = date('i:s', ($has['time_h']-time()));//ваша дата
$time2 = explode(':',$time);
$time2 = ($time2[0]*60)+$time2[1];

HTML5
1
2
3
4
5
<div>
<span>Осталось:&nbsp;</span>
<span class="afss_mins_bv">00</span>&nbsp;мин.&nbsp;
<span class="afss_secs_bv">00&nbsp;</span>&nbsp;сек.
</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
var remain_bv = <?=$time2?>;
function parseTime_bv(timestamp){
    if (timestamp < 0) timestamp = 0;
 
    var mins = Math.floor((timestamp)/60);
    var secs = Math.floor(timestamp - mins*60);
 
    if(String(mins).length > 1)
        $('span.afss_mins_bv').text(mins);
    else
        $('span.afss_mins_bv').text("0" + mins);
    if(String(secs).length > 1)
        $('span.afss_secs_bv').text(secs);
    else
        $('span.afss_secs_bv').text("0" + secs);
     
}
 
$(document).ready(function(){
    var intt=setInterval(function(){
        remain_bv = remain_bv - 1;
        parseTime_bv(remain_bv);
        if(remain_bv <= 0){
             //здесь ваш код который нужно исполнить по истечению времени
    clearInterval(intt);
        }
    }, 1000);
});

@dalus · 01.09.2018, 15:28 **[ТС]**

00Danik,

Осталось NaN пишет что то не так опять сделал (

Добавлено через 3 минуты
$time должно же за что то отвечать

@00Danik · 01.09.2018, 15:32

dalus, Вставте это в ваш исполняемый файл PHP на сервере
и проверте правильно ли все с вашем временем date('i:s', ($has['time_h']-time())) должно быть формата 01:50

PHP
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
<?php
 
$time = date('i:s', ($has['time_h']-time()));//ваша дата
$time2 = explode(':',$time);
$time2 = ($time2[0]*60)+$time2[1];
 
?>
 
<div>
<span>Осталось:&nbsp;</span>
<span class="afss_mins_bv">00</span>&nbsp;мин.&nbsp;
<span class="afss_secs_bv">00&nbsp;</span>&nbsp;сек.
</div>
 
<script type="text/javascript">
var remain_bv = <?=$time2?>;
function parseTime_bv(timestamp){
    if (timestamp < 0) timestamp = 0;
 
    var mins = Math.floor((timestamp)/60);
    var secs = Math.floor(timestamp - mins*60);
 
    if(String(mins).length > 1)
        $('span.afss_mins_bv').text(mins);
    else
        $('span.afss_mins_bv').text("0" + mins);
    if(String(secs).length > 1)
        $('span.afss_secs_bv').text(secs);
    else
        $('span.afss_secs_bv').text("0" + secs);
     
}
 
$(document).ready(function(){
    var intt=setInterval(function(){
        remain_bv = remain_bv - 1;
        parseTime_bv(remain_bv);
        if(remain_bv <= 0){
            alert('aaa');
            clearInterval(intt);
        }
    }, 1000);
});
</script>

@dalus · 01.09.2018, 15:58 **[ТС]**

00Danik,

Заработало,большое спасибо, А как добавить еще часов и дней?

@00Danik · 01.09.2018, 16:12

В каком формате у вас входные параметры 15:09:20? Нужно было сразу написать что вас интересует код с днями и часами.

@dalus · 01.09.2018, 16:14 **[ТС]**

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

Добавлено через 50 секунд
Осталось: 45 мин. 20 сек. в таком формате

@00Danik · 01.09.2018, 16:18

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

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
<div>
<span>Осталось:&nbsp;</span><span class="afss_day_bv">0</span> д.
<span class="afss_hours_bv">00</span>&nbsp;час.&nbsp;
<span class="afss_mins_bv">00</span>&nbsp;мин.&nbsp;
<span class="afss_secs_bv">00&nbsp;</span>&nbsp;сек.
</div>
 
 
<script type="text/javascript">
var remain_bv = 10;//СЮДА ПРОСТО ВАВМ НУЖНО ПЕРЕДАТЬ КОЛИЧЕСТВО СЕКУНД (сейчас например 10сек)
function parseTime_bv(timestamp){
    if (timestamp < 0) timestamp = 0;
 
    var day = Math.floor( (timestamp/60/60) / 24);
    var hour = Math.floor(timestamp/60/60);
    var mins = Math.floor((timestamp - hour*60*60)/60);
    var secs = Math.floor(timestamp - hour*60*60 - mins*60); 
    var left_hour = Math.floor( (timestamp - day*24*60*60) / 60 / 60 );
 
    $('span.afss_day_bv').text(day);
    $('span.afss_hours_bv').text(left_hour);
 
    if(String(mins).length > 1)
        $('span.afss_mins_bv').text(mins);
    else
        $('span.afss_mins_bv').text("0" + mins);
    if(String(secs).length > 1)
        $('span.afss_secs_bv').text(secs);
    else
        $('span.afss_secs_bv').text("0" + secs);
     
}
 
$(document).ready(function(){
    var intt=setInterval(function(){
        remain_bv = remain_bv - 1;
        parseTime_bv(remain_bv);
        if(remain_bv <= 0){
            alert('aaa');
            clearInterval(intt);
        }
    }, 1000);
});
</script>

@dalus · 01.09.2018, 16:22 **[ТС]**

00Danik, Вы все верно мне говорите, это лично я непонятно пишу, в целом что я хочу

таймер, время которое берется кодом time()+(10*1); не в ручную

где юзер, в моем случаи нажимает взять подарок, после ожидает 10 секунд к примеру, опят может забрать его

@00Danik · 01.09.2018, 16:26

dalus,
в любом случаи вам просто нужно будет задать любым способом значение переменной remain_bv в секундах, в любом из моих примеров.

например:

JavaScript
1
var remain_bv = <?=time()+(10*1)?>;

Новые блоги и статьи Все статьи Все блоги /
PhpStorm 2025.3: WSL Terminal всегда стартует в ~ and_y87 14.12.2025 PhpStorm 2025. 3: WSL Terminal всегда стартует в ~ (home), игнорируя директорию проекта Симптом: После обновления до PhpStorm 2025. 3 встроенный терминал WSL открывается в домашней директории. . .	Как объединить две одинаковые БД Access с разными данными VikBal 11.12.2025 Помогите пожалуйста !! Как объединить 2 одинаковые БД Access с разными данными.	Новый ноутбук volvo 07.12.2025 Всем привет. По скидке в "черную пятницу" взял себе новый ноутбук Lenovo ThinkBook 16 G7 на Амазоне: Ryzen 5 7533HS 64 Gb DDR5 1Tb NVMe 16" Full HD Display Win11 Pro	Музыка, написанная Искусственным Интеллектом volvo 04.12.2025 Всем привет. Некоторое время назад меня заинтересовало, что уже умеет ИИ в плане написания музыки для песен, и, собственно, исполнения этих самых песен. Стихов у нас много, уже вышли 4 книги, еще 3. . .	От async/await к виртуальным потокам в Python IndentationError 23.11.2025 Армин Ронахер поставил под сомнение async/ await. Создатель Flask заявляет: цветные функции - провал, виртуальные потоки - решение. Не threading-динозавры, а новое поколение лёгких потоков. Откат?. . .
Поиск "дружественных имён" СОМ портов Argus19 22.11.2025 Поиск "дружественных имён" СОМ портов На странице: https:/ / norseev. ru/ 2018/ 01/ 04/ comportlist_windows/ нашёл схожую тему. Там приведён код на С++, который показывает только имена СОМ портов, типа,. . .	Сколько Государство потратило денег на меня, обеспечивая инсулином. Programma_Boinc 20.11.2025 Сколько Государство потратило денег на меня, обеспечивая инсулином. Вот решила сделать интересный приблизительный подсчет, сколько государство потратило на меня денег на покупку инсулинов. . . .	Ломающие изменения в C#.NStar Alpha Etyuhibosecyu 20.11.2025 Уже можно не только тестировать, но и пользоваться C#. NStar - писать оконные приложения, содержащие надписи, кнопки, текстовые поля и даже изображения, например, моя игра "Три в ряд" написана на этом. . .	Мысли в слух kumehtar 18.11.2025 Кстати, совсем недавно имел разговор на тему медитаций с людьми. И обнаружил, что они вообще не понимают что такое медитация и зачем она нужна. Самые базовые вещи. Для них это - когда просто люди. . .	Создание Single Page Application на фреймах krapotkin 16.11.2025 Статья исключительно для начинающих. Подходы оригинальностью не блещут. В век Веб все очень привыкли к дизайну Single-Page-Application . Быстренько разберем подход "на фреймах". Мы делаем одну. . .

Таймер обратного отсчета

Решение

Решение

@dalus 0 / 0 / 0 Регистрация: 31.08.2018 Сообщений: 25

	Таймер обратного отсчета 31.08.2018, 14:44. Показов 3801. Ответов 14 Метки нет (Все метки) У меня проблема, хочу создать таймер обратного отсчета, лично у меня все получилось, создаю таймер не по заданному таймингу, а через базу данных. То есть юзер нажимает кнопку после чего показывает до следующего действия осталось "время" у меня все это получилось, но проблема моя в том что отсчета времени не идет, только когда обновляю страницу тогда идет, почему так? прошу прощение если не понятно объяснил я новичок ! 0

@andyyy 767 / 323 / 157 Регистрация: 26.05.2016 Сообщений: 2,127
	31.08.2018, 15:47
	нужен javascript 0

@dalus 0 / 0 / 0 Регистрация: 31.08.2018 Сообщений: 25
	01.09.2018, 13:55 [ТС]
	00Danik, echo'<td><div align="center"><div>Осталось <b></div> '.date('i:s', ($hach['time_h']-time()).' </b></font> </font></td>'; '.date('i:s', ($hach['time_h']-time()) ).' Вот код в php файле. что нужно дописать что бы шел обратный отсчет? + подключить javascript буду очень благодарен выше написанного сделал я так: подключил javascript и прописал так: echo'<td><div align="center"><div>Осталось <b></div><div id="timer_inp"> '.date('i:s', ($hach['time_h']-time()).' </div></b></font> </font></td>'; После чего сработал обратный отсчет но вывод цифр написано NaN 0

@dalus 0 / 0 / 0 Регистрация: 31.08.2018 Сообщений: 25
	01.09.2018, 13:56 [ТС]
	Не помогло 0

@dalus 0 / 0 / 0 Регистрация: 31.08.2018 Сообщений: 25
	01.09.2018, 14:01 [ТС]
	Мой php код echo'<td><div>Осталось <b></div> '.date('i:s', ($has['time_h']-time())).'</font> </font></b></td>'; этот код отвечает за время '.date('i:s', ($has['time_h']-time())).' Как я написал выше все работает но время стоит на месте приходится обновлять каждый раз страницу выше скинутый код попробовал я подключил javascript в php файле прописал следующее echo'<td><div>Осталось <b></div><div id="timer_inp"> '.date('i:s', ($has['time_h']-time())).'</div></font> </font></b></td>'; после чего обратный отсчет показал NaN что я сделал не так? 0

@dalus 0 / 0 / 0 Регистрация: 31.08.2018 Сообщений: 25
	01.09.2018, 15:28 [ТС]
	00Danik, Осталось NaN пишет что то не так опять сделал ( Добавлено через 3 минуты $time должно же за что то отвечать 0

@dalus 0 / 0 / 0 Регистрация: 31.08.2018 Сообщений: 25
	01.09.2018, 15:58 [ТС]
	00Danik, Заработало,большое спасибо, А как добавить еще часов и дней? 0

@00Danik 15 / 11 / 6 Регистрация: 30.01.2016 Сообщений: 84
	01.09.2018, 16:12
	В каком формате у вас входные параметры 15:09:20? Нужно было сразу написать что вас интересует код с днями и часами. 0

@dalus 0 / 0 / 0 Регистрация: 31.08.2018 Сообщений: 25
	01.09.2018, 16:14 [ТС]
	Наткнулся на проблему таймера, время к примеру 10 секунд таймера будет идти бесконечно, почему? мне к примеру нужно 10 к примеру прошло и время закончилось Добавлено через 50 секунд Осталось: 45 мин. 20 сек. в таком формате 0

@dalus 0 / 0 / 0 Регистрация: 31.08.2018 Сообщений: 25
	01.09.2018, 16:22 [ТС]
	00Danik, Вы все верно мне говорите, это лично я непонятно пишу, в целом что я хочу таймер, время которое берется кодом *time()+(101);** не в ручную где юзер, в моем случаи нажимает взять подарок, после ожидает 10 секунд к примеру, опят может забрать его 0