Beauty

localstorage на JS

21 сообщение в этой теме

подскажите пожалуйста как записать данные в localstorage браузера на сутки, чтобы счетчик не обновлялся каждый раз при перезагрузке страницы

var deadline = new Date(Date.parse(new Date()) + 2 * 22 * 60 * 60 * 1000); // for endless timer

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах
function getTimeRemaining(endtime) {
  var t = Date.parse(endtime) - Date.parse(new Date());
  var seconds = Math.floor((t / 1000) % 60);
  var minutes = Math.floor((t / 1000 / 60) % 60);
  var hours = Math.floor((t / (1000 * 60 * 60)) % 24);
  var days = Math.floor(t / (1000 * 60 * 60 * 24));
  return {
    'total': t,
    'days': days,
    'hours': hours,
    'minutes': minutes,
    'seconds': seconds
  };
}
 
function initializeClock(id, endtime) {
  var clock = document.getElementById(id);
  var daysSpan = clock.querySelector('.days');
  var hoursSpan = clock.querySelector('.hours');
  var minutesSpan = clock.querySelector('.minutes');
  var secondsSpan = clock.querySelector('.seconds');
 
  function updateClock() {
    var t = getTimeRemaining(endtime);
 
    daysSpan.innerHTML = t.days;
    hoursSpan.innerHTML = ('0' + t.hours).slice(-2);
    minutesSpan.innerHTML = ('0' + t.minutes).slice(-2);
    secondsSpan.innerHTML = ('0' + t.seconds).slice(-2);
 
    if (t.total <= 0) {
      clearInterval(timeinterval);
    }
  }
 
  updateClock();
  var timeinterval = setInterval(updateClock, 1000);
}
 
//var deadline="march 12 2018 00:00:00 GMT+0300"; //for Ukraine
var deadline = new Date(Date.parse(new Date()) + 2 * 22 * 60 * 60 * 1000); // for endless timer


initializeClock('clockdiv', deadline);

 

вот весь код, все работает отлично кроме того, что обновляется при переходе по страницам :(

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Добавляем

localStorage.setItem('ключ', 'значение')

Достаём

localStorage.getItem('ключ')

и бери время просто 

new Date();

в итоге как то так будет

// 
var time = new Date();

if ( localStorage.getItem('ключ') < time ) { // срок закончился
  
	localStorage.setItem('ключ', ( time + интервал )); обновимся
                                       
} else {
         ..... // Все норм, страницу вызывали уже в заданный интервал
}
         

и не забудь про undefined

Vovik понравилось это

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Не совсем понимаю ключ значение и прочее

Что добавить надо то и куда? :(

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах
Только что, Beauty сказал:

Не совсем понимаю ключ значение и прочее

Что добавить надо то и куда? :(

Не понимаю ключ => значение ? :) Почитай, пригодится.

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

ответ более чем исчерпывающий. 

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Про это ключ значение и тд везде пишут, а что куда и как непонятно

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах
Только что, Beauty сказал:

Про это ключ значение и тд везде пишут, а что куда и как непонятно

читай про объекты http://javascript.ru/node/106

 

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Там текста на 3 дня читать,  не говоря уже чтобы понять все что там написано))))

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах
var deadline = new Date(Date.parse(new Date()) + 2 * 22 * 60 * 60 * 1000); // for endless timer
 
var deadline = new Date();

if ( localStorage.getItem('deadtime') < deadline ) { // срок закончился
  
	localStorage.setItem('deadtime', ( deadline + 2 * 22 * 60 * 60 * 1000 )); обновимся
                                       
} else {
         initializeClock('clockdiv', deadline);
}

заменил первую строку на это, не работает, подскажи что не так?

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

у меня все работает

может перед обновимся добавить // ? Закомментировать это слово

Beauty понравилось это

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах
15 минут назад, gefard сказал:

у меня все работает

может перед обновимся добавить // ? Закомментировать это слово

// это само собой

но время показывает -1 -1 -1 -1...

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах
Только что, Beauty сказал:

// это само собой

но время показывает -1 -1 -1 -1...

else {
initializeClock('clockdiv', new Date(Date.parse(new Date()) + 2 * 22 * 60 * 60 * 1000) );
}

 

Beauty понравилось это

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

deadtime записалось в localstorage как Sat Mar 10 2018 20:47:36 GMT+0300 (MSK)158400000 (на две минуты назад)

var deadline = new Date();

if ( localStorage.getItem('deadtime') < deadline ) { // срок закончился
  
	localStorage.setItem('deadtime', ( deadline + 2 * 22 * 60 * 60 * 1000 )); //обновимся
                                       
} else {
    initializeClock('clockdiv', new Date(Date.parse(new Date()) + 2 * 22 * 60 * 60 * 1000) );
}

теперь счетчик работает но при обновлении страницы все по новой начинается

грубо говоря то же самое что и было изначально тока теперь deadtime просроченный записан в storage :huh:

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах
28 минут назад, Beauty сказал:

deadtime записалось в localstorage как Sat Mar 10 2018 20:47:36 GMT+0300 (MSK)158400000 (на две минуты назад)


var deadline = new Date();

if ( localStorage.getItem('deadtime') < deadline ) { // срок закончился
  
	localStorage.setItem('deadtime', ( deadline + 2 * 22 * 60 * 60 * 1000 )); //обновимся
                                       
} else {
    initializeClock('clockdiv', new Date(Date.parse(new Date()) + 2 * 22 * 60 * 60 * 1000) );
}

теперь счетчик работает но при обновлении страницы все по новой начинается

грубо говоря то же самое что и было изначально тока теперь deadtime просроченный записан в storage :huh:

Да что ж делать то будешь? было же написано

} else {
         ..... // Все норм, страницу вызывали уже в заданный интервал
}

значит

var deadline = Math.floor( new Date() );

if ( localStorage.getItem('deadtime') < deadline || localStorage.getItem('deadtime') === undefined ) { // срок закончился
  
	localStorage.setItem('deadtime', ( deadline + ( 2 * 22 * 60 * 60 * 1000 ) ));
    initializeClock('clockdiv', new Date(Date.parse(new Date()) + 2 * 22 * 60 * 60 * 1000) );
                                       
} 

сотри localStorage

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах
46 минут назад, gefard сказал:

var deadline = Math.floor( new Date() ); if ( localStorage.getItem('deadtime') < deadline || localStorage.getItem('deadtime') === undefined ) { // срок закончился localStorage.setItem('deadtime', ( deadline + ( 2 * 22 * 60 * 60 * 1000 ) )); initializeClock('clockdiv', new Date(Date.parse(new Date()) + 2 * 22 * 60 * 60 * 1000) ); }

тоже нифига не работает(

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

у меня все работает. и да ответ нифига не работает это не ответ.

что конкретно? 

localStorage не записывается? его формат не правильный?

что консоль пишет? там есть ошибки? 

к сожалению я не телепат.

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах
3 минуты назад, gefard сказал:

у меня все работает. и да ответ нифига не работает это не ответ.

что конкретно? 

localStorage не записывается? его формат не правильный?

что консоль пишет? там есть ошибки? 

к сожалению я не телепат.

https://getkeds.ru/products/new-balance-580-elite-edition-with-fur-beigesilver-grey-uy2269gk

сделал и так и так уже, максимум что добился это то, что счетчик работает, в storage deadtime записалась текущая дата и время и все.. но при обновлении стариницы счетчик обновляется

по сути вернулся к тому с чем пришел)

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах
Только что, Beauty сказал:

по сути вернулся к тому с чем пришел)

вот в том то и дело, правильно заданный вопрос - половина ответа

var deadline = Math.floor( new Date() );

if ( localStorage.getItem('deadtime') < deadline || localStorage.getItem('clock_end_time') === null ) { // срок закончился
    
    var clock_end_time = new Date(Date.parse(new Date()) + 2 * 22 * 60 * 60 * 1000);
                                              
	localStorage.setItem('deadtime', ( deadline + ( 2 * 22 * 60 * 60 * 1000 ) ));
    localStorage.setItem('clock_end_time', clock_end_time );
    initializeClock('clockdiv', clock_end_time );
                                       
} else initializeClock('clockdiv', localStorage.getItem('clock_end_time') );
 

пробуй этот, должен работать в твоем случае

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах
1 минуту назад, gefard сказал:

вот в том то и дело, правильно заданный вопрос - половина ответа


var deadline = Math.floor( new Date() );

if ( localStorage.getItem('deadtime') < deadline || localStorage.getItem('clock_end_time') === null ) { // срок закончился
    
    var clock_end_time = new Date(Date.parse(new Date()) + 2 * 22 * 60 * 60 * 1000);
                                              
	localStorage.setItem('deadtime', ( deadline + ( 2 * 22 * 60 * 60 * 1000 ) ));
    localStorage.setItem('clock_end_time', clock_end_time );
    initializeClock('clockdiv', clock_end_time );
                                       
} else initializeClock('clockdiv', localStorage.getItem('clock_end_time') );
 

пробуй этот, должен работать в твоем случае

алилуя) мне этот ключ + значение сегодня сниться будут)))) СПАСИБО!)))

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Создайте аккаунт или войдите в него для комментирования

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

Создать аккаунт

Зарегистрируйтесь для получения аккаунта. Это просто!


Зарегистрировать аккаунт

Войти

Уже зарегистрированы? Войдите здесь.


Войти сейчас

  • Сейчас на странице   0 пользователей

    Нет пользователей, просматривающих эту страницу