Скрипт автообновления, почти доделал UserJ

@Dyec · Регистрация: 10.05.2017

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

Привет всем. Строго не судите, я новичок в JS и это первый скрипт мой, работал давно с PHP и HTML. Возник ряд вопросов, один из них главный - это как заставить скрипт работать автономно после ввода секунд? Пробывал применять sessionStorage, но что-то не выходит. Работает как разовый таймер.

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

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
96
97
98
99
100
101
102
103
104
 // ==UserScript==
// @name        Autorefresh
// @version     1.0
// @date        2018-01-19
// ==/UserScript==
 
if(!self.parent.frames.length)  {
 
 
  var sec = "5"; // секунд
 
function askSeconds() {
  var age = prompt('Время в секундах (2-180):', sec);
 
if(!age) {
  callback();
//alert('Пустое значение!');
}
else if(age < 2) {
  alert('Слишком мало! Минимум 2 секунды!');
}
else if(age > 180) {
  alert('Слишком много! Максимум 180 секунд!');
} else {
 
 var second = age;
 var ag = '1';
 
 }
 
 
if(ag='1') {
 
function traySec()
        {
          
if(second<=9) {
  second='0' + second; }
 
if(document.getElementById) {
  timer.innerHTML=second; }
 
if(second==00) {
return false; }
 
second--;
 
setTimeout(traySec, 1000);
}
 
 function trayInfo() {
 
var d = document;
var e = d.createElement('button');
e.style.cssText = 'font-size: 10pt; position: fixed; top: 135px; left: 0px; height: 32px; width: 38px; background: #e3e8e1; border-radius: 0 4px 4px 0; border: 1px solid gray; z-index: 9999; opacity: 0.9; filter:alpha(opacity=90);';
d.documentElement.appendChild(e);
e.innerHTML = '<big><big><b><font color="black"><span id="timer"></span></color></b></big></big>';
e.onclick = function() {
 
//пауза traySec
     }
   }
 
trayInfo();
traySec();
 
function refresh() { 
location.reload();
}
setInterval(refresh, age*1000);
 
}
 
}//закрытие askSecond
 
 
function autorefresh() {
  var d = document;
  var e = d.createElement('button');
e.style.cssText = 'font-size: 10pt; position: fixed; top: 100px; left: 0px; height: 32px; width: 38px; background: #e3e8e1; border-radius: 0 4px 4px 0; border: 1px solid gray; z-index: 9999; opacity: 0.9; filter:alpha(opacity=90);';
d.documentElement.appendChild(e);
e.innerHTML = '<big><big><b><font color="black">↻</color></b></big></big>';
e.onclick = function() {
 
askSeconds();
 
stopautorefresh();
 
    }
  }
autorefresh();
 
function stopautorefresh() {
  var d = document;
  var e = d.createElement('button');
e.style.cssText = 'font-size: 10pt; position: fixed; top: 100px; left: 0px; height: 32px; width: 38px; background: #e3e8e1; border-radius: 0 4px 4px 0; border: 1px solid gray; z-index: 9999; opacity: 0.9; filter:alpha(opacity=90);';
d.documentElement.appendChild(e);
e.innerHTML = '<big><big><b><font color="black">X</color></b></big></big>';
e.onclick = function() {
//stop
 
    }
 
}

А вот и скрины (см. ниже) как это выглядит!
Правда на некоторых сайтах кнопка стоит на месте и не прыгает вместе с прокруткой

@Dyec · 25.01.2018, 06:15 **[ТС]**

и тут тишина

Добавлено через 1 час 54 минуты
сократил немного код на килобайт

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
96
97
98
99
100
101
102
if(!self.parent.frames.length)  {
 
  var d = document;
  var e = d.createElement('button');
  var setCss = 'font-size: 10pt; position: fixed; left: 0px; height: 32px; width: 38px; background: #e3e8e1; border-radius: 0 4px 4px 0; border: 1px solid gray; z-index: 9999; opacity: 0.9; filter:alpha(opacity=90); ';
  var blackA = '<big><big><b><font color="black">';
  var stopX = '✖';
  var refO = '↻';
  var blackB = '</color></b></big></big>';
  var sec = "5"; // секунд
 
function askSeconds() {
  var age = prompt('Время в секундах (2-180):', sec);
 
if(!age) {
  callback();
//alert('Пустое значение!');
}
else if(age < 2) {
  alert('Слишком мало! Минимум 2 секунды!');
}
else if(age > 180) {
  alert('Слишком много! Максимум 180 секунд!');
} else {
 
 var second = age;
 var ag = '1';
 
 }
 
 
if(ag='1') {
 
 
function traySec()
        {
          
if(second<=9) {
  second='0' + second; }
 
if(document.getElementById) {
  timer.innerHTML=second; }
 
if(second==00) {
return false; }
 
second--;
 
setTimeout(traySec, 1000);
}
 
 function trayInfo() {
var e = d.createElement('button');
e.style.cssText = setCss+'top: 135px;';
d.documentElement.appendChild(e);
e.innerHTML = blackA+'<span id="timer"></span>'+blackB;
e.onclick = function() {
 
//пауза traySec
     }
   }
 
trayInfo();
traySec();
 
function refresh() { 
location.reload();
}
setInterval(refresh, age*1000);
 
  }
 
}//закрытие askSecond
 
 
function autorefresh() {
 
e.style.cssText = setCss+'top: 100px;';
d.documentElement.appendChild(e);
e.innerHTML = blackA+refO+blackB;
e.onclick = function() {
 
askSeconds();
 
stopautorefresh();
 
    }
  }
autorefresh();
 
function stopautorefresh() {
 
e.style.cssText = setCss+'top: 100px;';
d.documentElement.appendChild(e);
e.innerHTML = blackA+stopX+blackB;
e.onclick = function() {
//stop
 
    }
  }
 
}

@Htext · 27.01.2018, 18:07

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

работать автономно

Вопрос непонятен. Как это - автономно? От чего - автономно?

@Dyec · 29.01.2018, 06:01 **[ТС]**

Htext, после ввода таймера, чтобы страница автоматически обновлялась до закрытия вкладки или нажатия кнопки стоп которую я почти доделал. Пробывал разными методами через sessionStorage, но не работает или я не правильно понимаю эту функцию записи сессии и как с ней работать. Смотрел примеры, не то и их мало. Мне бы хотя бы подзказку. А дальше сам.

Добавлено через 2 часа 19 минут

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
96
97
98
if(!self.parent.frames.length)  {
 
  var d = document;
  var e = d.createElement('button');
  var setCss = 'font-size: 10pt; position: fixed; left: 0px; height: 32px; width: 38px; background: #e3e8e1; border-radius: 0 4px 4px 0; border: 1px solid gray; z-index: 9999; opacity: 0.9; filter:alpha(opacity=90); ';
  var blackA = '<big><big><b><font color="black">';
  var stopX = '✖';
  var refO = '↻';
  var blackB = '</color></b></big></big>';
  var sec = "5"; // секунд
 
 
function askSeconds() {
  var age = prompt('Время в секундах (2-180):', sec);
 
if(!age) {
  callback();
//alert('Пустое значение!');
}
else if(age < 2) {
  alert('Слишком мало! Минимум 2 секунды!');
callback();
}
else if(age > 180) {
  alert('Слишком много! Максимум 180 секунд!');
callback();
} else {
 
  var second = age;
trayInfo();
traySec();
 
function refresh() { 
location.reload();
 }
 
refreshId = setInterval(refresh, age*1000);
 
}
 
function traySec()
        {
          
if(second<=9) {
  second='0' + second; }
 
if(document.getElementById) {
  timer.innerHTML=second; }
 
if(second==00) {
return false; }
 
second--;
 
setTimeout(traySec, 1000);
}
 
 function trayInfo() {
  var e = d.createElement('button');
e.style.cssText = setCss+'top: 135px;';
d.documentElement.appendChild(e);
e.innerHTML = blackA+'<span id="timer"></span>'+blackB;
e.onclick = function() {
//пауза traySec
     }
   }
 
}//askSecond
 
function autorefresh() {
 
e.style.cssText = setCss+'top: 100px;';
d.documentElement.appendChild(e);
e.innerHTML = blackA+refO+blackB;
e.onclick = function() {
 
askSeconds();
 
stopautorefresh();
 
    }
  }
autorefresh();
 
function stopautorefresh() {
 
e.style.cssText = setCss+'top: 100px;';
d.documentElement.appendChild(e);
e.innerHTML = blackA+stopX+blackB;
e.onclick = function() {
 
clearInterval(refreshId);
return autorefresh();
 
    }
  }
 
}

вот код поправленный

Добавлено через 20 часов 51 минуту
Разобрался с автономностью. Работает после запуска как часы. Остался одна проблема, как вынести функции timerInfo(); и timerSec(); за пределы функции askSeconds(); ? Пробывал не пашет, я так понял надо в функцию аргументы переменных передать? Вот переписанный код чтобы было понятно:

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
96
97
98
99
100
101
102
103
if(!self.parent.frames.length)  {
 
  var d = document;
  var e = d.createElement('button');
  var setCss = 'font-size: 10pt; position: fixed; left: 0px; height: 32px; width: 38px; background: #e3e8e1; border-radius: 0 4px 4px 0; border: 1px solid gray; z-index: 9999; opacity: 0.9; filter:alpha(opacity=90); ';
  var blackA = '<big><big><b><font color="black">';
  var stopX = '✖';
  var refO = '↻';
  var blackB = '</color></b></big></big>';
  var sec = "5"; // секунд
 
function askSeconds() {
  var ask = prompt('Время в секундах (2-180):', sec);
 
if(!ask) {
  callback();
//alert('Пустое значение!');
}
else if(ask < 2) {
  alert('Слишком мало! Минимум 2 секунды!');
callback();
}
else if(ask > 180) {
  alert('Слишком много! Максимум 180 секунд!');
callback();
} else {
sessionStorage.setItem('key', ask);
  var second = ask;
timerInfo();
timerSec();
refreshId = setInterval(reload, ask*1000);
 
}
 
function timerSec()
        {
          
if(second<=9) {
  second='0' + second; }
 
if(document.getElementById) {
  timer.innerHTML=second; }
 
if(second==00) {
return false; }
 
second--;
 
setTimeout(timerSec, 1000);
}
 
 function timerInfo() {
 
var e = d.createElement('button');
e.style.cssText = setCss+'top: 135px;';
d.documentElement.appendChild(e);
e.innerHTML = blackA+'<span id="timer"></span>'+blackB;
e.onclick = function() {
//пауза
     }
   }
 
}//askSeconds
 
function startrefresh() {
 
e.style.cssText = setCss+'top: 100px;';
d.documentElement.appendChild(e);
e.innerHTML = blackA+refO+blackB;
e.onclick = function() {
 
askSeconds();
 
stopautorefresh();
 
    }
  }
startrefresh();
 
function stopautorefresh() {
 
e.style.cssText = setCss+'top: 100px;';
d.documentElement.appendChild(e);
e.innerHTML = blackA+stopX+blackB;
e.onclick = function() {
 
sessionStorage.clear();
clearInterval(refreshId);
return startrefresh();
 
    }
  }
 
if(sessionStorage.getItem('key')) {
var sk = sessionStorage.getItem('key');
function reload() { 
location.reload();
 }
 
refreshId = setInterval(reload, sk*1000);
}
 
}

Добавлено через 6 часов 49 минут
Сделал наконц-то задуманное. Осталось убрать timerInfo и остановить timerSec по нажатию кнопки стоп, как нипробывал не выходит. Вот код:

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
96
97
98
99
100
101
102
103
104
105
106
107
if(!self.parent.frames.length)  {
 
  var d = document;
  var e = d.createElement('button');
  var setCss = 'font-size: 10pt; position: fixed; left: 0px; height: 32px; width: 38px; background: #e3e8e1; border-radius: 0 4px 4px 0; border: 1px solid gray; z-index: 9999; opacity: 0.9; filter:alpha(opacity=90); ';
  var blackA = '<big><big><b><font color="black">';
  var stopX = '✖';
  var refO = '↻';
  var blackB = '</color></b></big></big>';
  var sec = "5"; // секунд
  var second;
  var refreshId;
 
function reload() { 
location.reload();
 }
 
function timerSec()
        {
          
if(second<=9) {
  second='0' + second; }
 
if(document.getElementById) {
  timer.innerHTML=second; }
 
if(second==00) {
return false; }
 
second--;
 
setTimeout(timerSec, 1000);
}
 
function timerInfo() {
 
var e = d.createElement('button');
e.style.cssText = setCss+'top: 135px;';
d.documentElement.appendChild(e);
e.innerHTML = blackA+'<span id="timer"></span>'+blackB;
e.onclick = function() {
callback();
//пауза
     }
   }
 
function askSeconds() {
  var ask = prompt('Время в секундах (2-180):', sec);
 
if(!ask) {
  callback();
//alert('Пустое значение!');
}
else if(ask < 2) {
  alert('Слишком мало! Минимум 2 секунды!');
callback();
}
else if(ask > 180) {
  alert('Слишком много! Максимум 180 секунд!');
callback();
} else {
sessionStorage.setItem('key', ask);
  second = ask;
 
timerInfo();
timerSec(second);
refreshId = setTimeout(reload, ask*1000);
   }
 }
 
function startrefresh() {
e.style.cssText = setCss+'top: 100px;';
d.documentElement.appendChild(e);
e.innerHTML = blackA+refO+blackB;
e.onclick = function() {
 
askSeconds();
stopautorefresh();
 
    }
  }
 
 
function stopautorefresh() {
 
e.style.cssText = setCss+'top: 100px;';
d.documentElement.appendChild(e);
e.innerHTML = blackA+stopX+blackB;
e.onclick = function() {
 
sessionStorage.clear();
clearTimeout(refreshId);
return startrefresh();
 
    }
  }
 
if(sessionStorage.getItem('key')) {
second = sessionStorage.getItem('key');
stopautorefresh();
timerInfo();
timerSec(second);
refreshId = setInterval(reload, second*1000);
} else {
startrefresh();
}
}

Новые блоги и статьи Все статьи Все блоги /
[Owen Logic] Поддержание уровня воды в резервуаре количеством включённых насосов: моделирование и выбор регулятора ФедосеевПавел 14.03.2026 Поддержание уровня воды в резервуаре количеством включённых насосов: моделирование и выбор регулятора ВВЕДЕНИЕ Выполняя задание на управление насосной группой заполнения резервуара,. . .	делаю науч статью по влиянию грибов на сукцессию anaschu 13.03.2026 прикрепляю статью	SDL3 для Desktop (MinGW): Создаём пустое окно с нуля для 2D-графики на SDL3, Си и C++ 8Observer8 10.03.2026 Содержание блога Финальные проекты на Си и на C++: hello-sdl3-c. zip hello-sdl3-cpp. zip Результат:	Установка CMake и MinGW 13.1 для сборки С и C++ приложений из консоли и из Qt Creator в EXE 8Observer8 10.03.2026 Содержание блога MinGW - это коллекция инструментов для сборки приложений в EXE. CMake - это система сборки приложений. Здесь описаны базовые шаги для старта программирования с помощью CMake и. . .
Как дизайн сайта влияет на конверсию: 7 решений, которые реально повышают заявки Neotwalker 08.03.2026 Многие до сих пор воспринимают дизайн сайта как “красивую оболочку”. На практике всё иначе: дизайн напрямую влияет на то, оставит человек заявку или уйдёт через несколько секунд. Даже если у вас. . .	Модульная разработка через nuget packages DevAlt 07.03.2026 Сложившийся в . Net-среде способ разработки чаще всего предполагает монорепозиторий в котором находятся все исходники. При создании нового решения, мы просто добавляем нужные проекты и имеем. . .	Модульный подход на примере F# DevAlt 06.03.2026 В блоге дяди Боба наткнулся на такое определение: В этой книге («Подход, основанный на вариантах использования») Ивар утверждает, что архитектура программного обеспечения — это структуры,. . .	Управление камерой с помощью скрипта OrbitControls.js на Three.js: Вращение, зум и панорамирование 8Observer8 05.03.2026 Содержание блога Финальная демка в браузере работает на Desktop и мобильных браузерах. Итоговый код: orbit-controls-threejs-js. zip. Сканируйте QR-код на мобильном. Вращайте камеру одним пальцем,. . .