Таймер

@lect111 · Регистрация: 07.11.2012

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

Как сделать так, что бы количество обратных отсчётов было равно количеству элементов массива то-есть массив минут(10,15,5,20). Сколько элементов массива, столько же обратных отсчётов.
Обратный отсчёт:

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
<td>Осталось <span id="timer"></span> секунд</td>
<td>Осталось <span id="timer2"></span> секунд</td>
<td>Осталось <span id="timer3"></span> секунд</td>
<td>Осталось <span id="timer4"></span> секунд</td>
<td>Осталось <span id="timer5"></span> секунд</td>
 
<script type="text/javascript">
 
function GetTimer( id_write ) {
    var self = this;
  var i;
  self.min = 0;
  self.sec = 10;
  self.timer = function() {
    self.sec--; /* уменьшаем на одну секунду */
    if (self.sec<0) /* следующая минута */
    {
      self.sec = 59;
      self.min--;
    }
    var smin = ''+self.min;
    var ssec = ''+self.sec;
    if (smin.length<2) smin = '0'+smin; /* добавляем ведущие нули */
    if (ssec.length<2) ssec = '0'+ssec;
    document.getElementById(id_write).innerHTML = smin+':'+ssec;
    /* и выводим на страницу текущее значение */
    if (self.min==0 && self.sec==0) { 
      self.stop();
      document.getElementById(id_write).innerHTML=("Стоп");
    }
  }
  self.stop = function() {
      clearInterval(self.timerid)
  }  
  self.timerid = setInterval(self.timer,1000); /* запускаем таймер */
  return stop;
}
 
['',2,3,4].forEach(function(v) {
 new GetTimer('timer'+v.toString());
})
 
 
 setTimeout(function() {
  new GetTimer('timer5')} , 2000
 )
 
</script>

@WhiteMind · 29.04.2016, 15:09

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
<td>Осталось <span id="timer1"></span> секунд</td>
<td>Осталось <span id="timer2"></span> секунд</td>
<td>Осталось <span id="timer3"></span> секунд</td>
<td>Осталось <span id="timer4"></span> секунд</td>
 
<script type="text/javascript">
 
function GetTimer( id_write , min , sec ) {
    var self = this;
  var i;
  self.min = min;
  self.sec = sec;
  self.timer = function() {
    self.sec--; /* уменьшаем на одну секунду */
    if (self.sec<0) /* следующая минута */
    {
      self.sec = 59;
      self.min--;
    }
    var smin = ''+self.min;
    var ssec = ''+self.sec;
    if (smin.length<2) smin = '0'+smin; /* добавляем ведущие нули */
    if (ssec.length<2) ssec = '0'+ssec;
    document.getElementById(id_write).innerHTML = smin+':'+ssec;
    /* и выводим на страницу текущее значение */
    if (self.min==0 && self.sec==0) { 
      self.stop();
      document.getElementById(id_write).innerHTML=("Стоп");
    }
  }
  self.stop = function() {
      clearInterval(self.timerid)
  }  
  self.timerid = setInterval(self.timer,1000); /* запускаем таймер */
  return stop;
}
 
[
    {min:10,sec:0,timerId:'timer1'},
  {min:15,sec:0,timerId:'timer2'},
  {min:15,sec:0,timerId:'timer3'},
  {min:20,sec:0,timerId:'timer4'}
].forEach(function(info) {
    new GetTimer( info.timerId , info.min , info.sec )
})
 
</script>

Добавлено через 10 секунд
https://jsfiddle.net/annthkj6/1/

Добавлено через 22 минуты
?

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
<div id="timerList">
 
</div>
<script type="text/javascript">
 
function GetTimer( id_write , min , sec ) {
    var self = this;
  var i;
  self.min = min;
  self.sec = sec;
  self.timer = function() {
    self.sec--; /* уменьшаем на одну секунду */
    if (self.sec<0) /* следующая минута */
    {
      self.sec = 59;
      self.min--;
    }
    var smin = ''+self.min;
    var ssec = ''+self.sec;
    if (smin.length<2) smin = '0'+smin; /* добавляем ведущие нули */
    if (ssec.length<2) ssec = '0'+ssec;
    document.getElementById(id_write).innerHTML = smin+':'+ssec;
    /* и выводим на страницу текущее значение */
    if (self.min==0 && self.sec==0) { 
      self.stop();
      document.getElementById(id_write).innerHTML=("Стоп");
    }
  }
  self.stop = function() {
      clearInterval(self.timerid)
  }  
  self.timerid = setInterval(self.timer,1000); /* запускаем таймер */
  return stop;
}
 
[
    {min:10,sec:0,timerId:'timer1'},
  {min:15,sec:0,timerId:'timer2'},
  {min:15,sec:0,timerId:'timer3'},
  {min:20,sec:0,timerId:'timer4'}
].forEach(function(info) {
    var cnt = document.getElementById('timerList');
  cnt.innerHTML += '<div>Осталось <span id="'+info.timerId+'"></span> секунд</div><br/>'
    new GetTimer( info.timerId , info.min , info.sec )
})
 
</script>

Добавлено через 10 секунд
https://jsfiddle.net/annthkj6/2/

Добавлено через 25 минут
?

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
<div id="timerList"></div>
<script>
var arrayMinFromPhp = [10,15,5,20];// <?php implode(',',$arr); ?> ...
</script>
 
<script type="text/javascript">
 
function GetTimer( id_write , min , sec ) {
    var self = this;
  var i;
  self.min = min;
  self.sec = sec;
  self.timer = function() {
    self.sec--; /* уменьшаем на одну секунду */
    if (self.sec<0) /* следующая минута */
    {
      self.sec = 59;
      self.min--;
    }
    var smin = ''+self.min;
    var ssec = ''+self.sec;
    if (smin.length<2) smin = '0'+smin; /* добавляем ведущие нули */
    if (ssec.length<2) ssec = '0'+ssec;
    document.getElementById(id_write).innerHTML = smin+':'+ssec;
    /* и выводим на страницу текущее значение */
    if (self.min==0 && self.sec==0) { 
      self.stop();
      document.getElementById(id_write).innerHTML=("Стоп");
    }
  }
  self.stop = function() {
      clearInterval(self.timerid)
  }  
  self.timerid = setInterval(self.timer,1000); /* запускаем таймер */
  return stop;
}
 
 
arrayMinFromPhp.forEach(function(min , i) {
    var cnt = document.getElementById('timerList');
  var timerId = 'timer'+(i.toString());
  cnt.innerHTML += '<div>Осталось <span id="'+timerId+'"></span> секунд</div><br/>'
    new GetTimer( timerId , min , 0 )
})
 
</script>

https://jsfiddle.net/annthkj6/3/

@lect111 · 29.04.2016, 15:38 **[ТС]**

Появился вопрос 1. Переменные в массиве если записаны статично то всё происходит гладко. Если передавать их через php то появляется такая вещь, не подскажите, что можно сделать

@kalabuni · 29.04.2016, 15:46

WhiteMind
08-мь двоеточий и 26-ть секунд
классно у вас получилось

@WhiteMind · 29.04.2016, 15:55

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

Появился вопрос 1. Переменные в массиве если записаны статично то всё происходит гладко. Если передавать их через php то появляется такая вещь, не подскажите, что можно сделать

PHP
1
2
3
4
<div id="timerList"></div>
<script>
var arrayMinFromPhp = [ <?php echo implode(',',$vre); ?> ];
</script>

Добавлено через 22 секунды

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

WhiteMind
08-мь двоеточий и 26-ть секунд
классно у вас получилось

про что вы

@lect111 · 29.04.2016, 16:01 **[ТС]**

Большое спасибо)

@kalabuni · 29.04.2016, 17:04

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

про что вы

вот про это -- https://jsfiddle.net/annthkj6/2/

Новые блоги и статьи Все статьи Все блоги /
Как я обхитрил таблицу Word Alexander-7 21.03.2026 Когда мигает курсор у внешнего края таблицы, и нам надо перейти на новую строку, а при нажатии Enter создается новый ряд таблицы с ячейками, то мы вместо нервных нажатий Энтеров мы пишем любые буквы. . .	Krabik - рыболовный бот для WoW 3.3.5a AmbA 21.03.2026 без регистрации и смс. Это не торговля, приложение не содержит рекламы. Выполняет свою непосредственную задачу - автоматизацию рыбалки в WoW - и ничего более. Однако если админы будут против -. . .	Программный отбор значений справочника Maks 21.03.2026 Установка программного отбора значений справочника "Сотрудники" из модуля формы документа. В качестве фильтра для отбора служит предопределенное значение перечислений. Процедура. . .	Переходник USB-CAN-GPIO Eddy_Em 20.03.2026 Достаточно давно на работе возникла необходимость в переходнике CAN-USB с гальваноразвязкой, оный и был разработан. Однако, все меня терзала совесть, что аж 48-ногий МК используется так тупо: просто. . .
Оттенки серого Argus19 18.03.2026 Оттенки серого Нашёл в интернете 3 прекрасных модуля: Модуль класса открытия диалога открытия/ сохранения файла на Win32 API; Модуль класса быстрого перекодирования цветного изображения в оттенки. . .	SDL3 для Desktop (MinGW): Рисуем цветные прямоугольники с помощью рисовальщика SDL3 на Си и C++ 8Observer8 17.03.2026 Содержание блога Финальные проекты на Си и на C++: finish-rectangles-sdl3-c. zip finish-rectangles-sdl3-cpp. zip	Символические и жёсткие ссылки в Linux. algri14 15.03.2026 Существует два типа ссылок — символические и жёсткие. Ссылка в Linux — это запись в каталоге, которая может указывать либо на inode «файла-ИСТОЧНИКА», тогда это будет «жёсткая ссылка» (hard link),. . .	[Owen Logic] Поддержание уровня воды в резервуаре количеством включённых насосов: моделирование и выбор регулятора ФедосеевПавел 14.03.2026 Поддержание уровня воды в резервуаре количеством включённых насосов: моделирование и выбор регулятора ВВЕДЕНИЕ Выполняя задание на управление насосной группой заполнения резервуара,. . .

@lect111 1 / 1 / 0 Регистрация: 07.11.2012 Сообщений: 47
	29.04.2016, 15:38 [ТС]
	Появился вопрос 1. Переменные в массиве если записаны статично то всё происходит гладко. Если передавать их через php то появляется такая вещь, не подскажите, что можно сделать 0

@kalabuni супермизантроп 3941 / 2979 / 692 Регистрация: 18.04.2012 Сообщений: 8,629
	29.04.2016, 15:46
	WhiteMind 08-мь двоеточий и 26-ть секунд классно у вас получилось 0

@lect111 1 / 1 / 0 Регистрация: 07.11.2012 Сообщений: 47
	29.04.2016, 16:01 [ТС]
	Большое спасибо) 0

Таймер

Решение