Выполнение JS кода раз в сутки
На сайте есть блок с текстом - Сегодня на нашем сайте заказов 40.
Нужно что бы число с количеством заказов менялось раз в сутки в диапазоне от 10 до 50 для каждого пользователя. Можно с помощью Math.floor генерировать число, записывать в localStorage как я понял. Помогите пожалуйста грамотно написать скрипт. Пока вот так получается у меня, но это не совсем то что нужно.
<p>Сегодня на нашем сайте заказов - <span id="zn">32</span></p>
<script>
var logElem = document.querySelector("#zn");
logElem.innerHTML = (Math.floor(Math.random() * 100) + 1);
</script>
|
Читаешь данные из "хранилища"... Там сумма и дата, когда ты ее "объявил"...
Если там нет ничего... Или уже прошли сутки - объявляешь другую сумму и записываешь в "хранилище" сумму и время ее объявления. |
Это примерно так должно выглядеть?
<p>Сегодня на нашем сайте заказов - <span id="zn">32</span></p>
<script>
var logElem = document.querySelector("#zn");
if(!localStorage.logElem) localStorage.logElem = new Date()
if(localStorage.logElem && new Date() - localStorage.logElem) {
logElem.innerHTML = (Math.floor(Math.random() * 100) + 1);
}
</script>
|
Цитата:
Цитата:
|
Переписал код. Вот что получилось.
Немного изменил условие. Заманил дату на минуты. Т.е. что бы число с заказами менялось каждую минуту. Почему то не работает.
<p>Сегодня на нашем сайте заказов - <span id="zn">32</span></p>
<script>
function zakaz() {
var logElem = document.querySelector("#zn");
var znn = 30;
var date = new Date;
var time, znach, a, b;
a = localStorage.setItem (time , date.getMinutes());
b = localStorage.setItem(znach , znn);
if (a == date.getMinutes())
{
return true;
} else {
a = localStorage.setItem (time , date.getMinutes());
logElem.innerHTML = (Math.floor(Math.random() * 100) + 1);
}
}
</script>
|
|
рони,
А как сделать что бы этот код работал с localStorage, т.е. как мне нужно. Я пробовал сделать так, но не получается:
<p>Сегодня на нашем сайте заказов - <span id="zn">32</span></p>
<script>
var date = new Date;
var ll, time;
let nums = [14, 1249, 1327, 1632];// до какого числа анимировать
let secs = [0, 3, 5, 9];//сколько времени будет длится анимация
let pause = [5, 10, 15, 0 ]; //пауза, после которой, запустится следущаяя анимация
const elem = document.querySelector('#zn');
const anim = (i, r) => {
let d = performance.now(),
from = +elem.textContent,
to = nums[i],
duration = secs[i] * 1000;
requestAnimationFrame( function e(b) {
b = (b - d) / duration;
1 <= b && (b = 1);
let c = from + (to - from) * b | 0;
localStorage.setItem(c, c);
elem.innerHTML = localStorage.getItem(c, c);
b == 1 && setTimeout(r,pause[i] * 1000);
1 > b && requestAnimationFrame(e)
})
ll = localStorage.setItem (time , date.getMinutes());
if (localStorage.setItem (time , date.getMinutes()) == ll) {
return true;
} else {
elem.innerHTML = localStorage.getItem(c, c);
}
}
const delay = i => new Promise(r => anim(i, r));
(async () => {
for (let i = 0; i < secs.length; i++) {
await delay(i);
}
})();
</script>
|
|
рони,
Спасибо! Это то что нужно. А как сделать что бы в этом вашем коде работа была с целыми числами? Т.е. что бы после запятой не было чисел.
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
</style>
<script>
document.addEventListener('DOMContentLoaded', ready);
function ready()
{
const options = {
increment: .01, // прибавлять от .01 до 0.7
different: .7,
basic: 0.7, //начальное число
delay: 10000, // пауза 10 сек
differentDelay: 0,
elem: document.querySelector('.box'), //куда выводить
key: 'basic' //ключ базы??? localStorage в качестве базы данных
};
const random = (increment, different) => +(increment + Math.random() * different);
const loop = () => {
options.basic = localStorage.basic ? +localStorage[options.key] : options.basic;
options.elem.innerHTML = options.basic.toFixed(2);
options.basic += random(options.increment, options.different);
localStorage[options.key] = options.basic;
setTimeout(loop, random(options.delay, options.differentDelay))
}
loop()
}
</script>
</head>
<body>
<div class="box"></div>
</body>
</html>
|
Цитата:
|
| Часовой пояс GMT +3, время: 10:18. |