Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 02.05.2021, 12:27
Аспирант
Отправить личное сообщение для Quark_ Посмотреть профиль Найти все сообщения от Quark_
 
Регистрация: 24.06.2015
Сообщений: 95

Не срабатывает сохранение стиля в cookie
Необходимо, чтобы по клику - стиль сохранился в cookie и между переходами по сайту блок не появлялся.
Что я делаю не так?

jQuery(document).ready(function(){
jQuery('.ppp .close').click(function(){
jQuery.cookie('.ppp').css("display", "none");
});
});


Ниже добавил jquery.cookie.js

jQuery.cookie=function(b,j,m){if(typeof j!="undefined"){m=m||{};if(j===null){j="";m.expires=-1}var e="";if(m.expires&&(typeof m.expires=="number"||m.expires.toUTCString)){var f;if(typeof m.expires=="number"){f=new Date();f.setTime(f.getTime()+(m.expires*24*60*60*1000))}else{f=m.expires}e="; expires="+f.toUTCString()}var l=m.path?"; path="+(m.path):"";var g=m.domain?"; domain="+(m.domain):"";var a=m.secure?"; secure":"";document.cookie=[b,"=",encodeURIComponent(j),e,l,g,a].join("")}else{var d=null;if(document.cookie&&document.cookie!=""){var k=document.cookie.split(";");for(var h=0;h<k.length;h++){var c=jQuery.trim(k[h]);if(c.substring(0,b.length+1)==(b+"=")){d=decodeURIComponent(c.substring(b.length+1));break}}}return d}};


Но пишет ошибку: Uncaught TypeError: Cannot read property 'css' of null
Ответить с цитированием
  #2 (permalink)  
Старый 02.05.2021, 14:05
Аватар для voraa
Профессор
Отправить личное сообщение для voraa Посмотреть профиль Найти все сообщения от voraa
 
Регистрация: 03.02.2020
Сообщений: 2,692

Сообщение от Quark_
Необходимо, чтобы по клику - стиль сохранился в cookie
jQuery.cookie('.ppp') - читает, а не сохраняет.

Если не требуется передавать информацию на сервер, то лучше использовать localStorage, а не cookies.
Ответить с цитированием
  #3 (permalink)  
Старый 02.05.2021, 16:01
Аспирант
Отправить личное сообщение для Quark_ Посмотреть профиль Найти все сообщения от Quark_
 
Регистрация: 24.06.2015
Сообщений: 95

Сообщение от voraa Посмотреть сообщение
jQuery.cookie('.ppp') - читает, а не сохраняет.

Если не требуется передавать информацию на сервер, то лучше использовать localStorage, а не cookies.
Вроде получилось, но не знаю, как добавить время действия, например 24 часа?

Код:
<div id="ppp">
<div id="ppp_close" onclick="onclickPC()">X</div>
</div>
var idPC = document.getElementById('ppp_close');
var idPB = document.getElementById('ppp');

function onclickPC() {
  idPB.style.display = (idPB.style.display == 'block') ? '' : 'none';
  localStorage.setItem('hide', idPB.style.display);
}

if(localStorage.getItem('hide') == 'none') {
  document.getElementById('ppp').style.display = 'none';
}
Ответить с цитированием
  #4 (permalink)  
Старый 02.05.2021, 16:10
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Сообщение от Quark_
как добавить время действия, например 24 часа?
сохранить время, потом проверить и если разница с текущим больше суток, то совершить необходимые действия
Ответить с цитированием
  #5 (permalink)  
Старый 02.05.2021, 21:55
Аспирант
Отправить личное сообщение для Quark_ Посмотреть профиль Найти все сообщения от Quark_
 
Регистрация: 24.06.2015
Сообщений: 95

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


var limit = 24 * 3600 * 1000; // 24 часа
var localStorageInitTime = localStorage.getItem('localStorageInitTime');

var idPC = document.getElementById('ppp_close');
var idPB = document.getElementById('ppp');

function onclickPC() {
  idPB.style.display = (idPB.style.display == 'block') ? '' : 'none';
  localStorage.setItem('hide', idPB.style.display);
}

if (localStorageInitTime === null) {

if(localStorage.getItem('hide') == 'none') {
  document.getElementById('ppp').style.display = 'none';
}

localStorage.setItem('localStorageInitTime', +new Date());
	
} else if(+new Date() - localStorageInitTime > limit) {

    localStorage.clear();
    localStorage.setItem('localStorageInitTime', +new Date());
}
Ответить с цитированием
  #6 (permalink)  
Старый 02.05.2021, 22:22
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Quark_,
var limit = 24 * 3600 * 1000; // 24 часа
var localStorageInitTime = localStorage.getItem('localStorageInitTime') || new Date();
var delta = new Date() - localStorageInitTime;
if(delta > limit) localStorage.removeItem('hide');
var idPC = document.getElementById('ppp_close');
var idPB = document.getElementById('ppp');

if(localStorage.getItem('hide') == 'none') {
    idPB.style.display = 'none';
}

function onclickPC() {
    idPB.style.display = 'none';
    localStorage.setItem('hide', 'none');
    localStorage.setItem('localStorageInitTime', +new Date());
}
Ответить с цитированием
  #7 (permalink)  
Старый 05.05.2021, 09:30
Аспирант
Отправить личное сообщение для Quark_ Посмотреть профиль Найти все сообщения от Quark_
 
Регистрация: 24.06.2015
Сообщений: 95

рони,
А как через консоль можно проверить, что по клику запустился таймер?
Вчера скрыл блок, через 24 часа зашел на сайт и он не появился (в стилях по-прежнему в display:none).
Ответить с цитированием
  #8 (permalink)  
Старый 05.05.2021, 09:54
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

localStorage скрыть на сутки
Quark_,
для примера 5 сек, успейте перезагрузить после клика.
<!DOCTYPE html>
<html>
<head>
    <title>Untitled</title>
    <meta charset="utf-8">
    <style type="text/css">
        #ppp {
            display: none;
        }
        #ppp.open {
            display: block;
        }
    </style>
</head>
<body>
    <div id="ppp">
        ppp
        <button type="button" id="ppp_close">ppp_close</button>
    </div>
    <script>
        document.addEventListener("DOMContentLoaded", function() {
            var limit = 5000; //24 * 3600 * 1000; // 24 часа
            var localStorageInitTime = localStorage.getItem('localStorageInitTime') || new Date() - limit;
            var delta = new Date() - localStorageInitTime;
            console.log(delta >= limit)//true - время вышло
            var idPC = document.getElementById('ppp_close');
            var idPB = document.getElementById('ppp');
            if (delta >= limit) {
                idPB.classList.add('open');
            }
            function onclickPC() {
                idPB.classList.remove('open');
                localStorage.setItem('localStorageInitTime', +new Date());
            }
            idPC.addEventListener('click', onclickPC)
        });
    </script>
</body>
</html>
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
изменение стиля кнопки с сохранение параметра после перезагрузки страницы AlexMonsterbit Элементы интерфейса 0 15.03.2019 18:11
Таймер срабатывает раньше времени или вообще не срабатывает Terebonko Элементы интерфейса 6 03.08.2017 12:43
Не сохраняет стиль страницы в cookie sana Events/DOM/Window 3 24.04.2015 12:02
Неправильно работает кнопка Нияз Элементы интерфейса 23 07.04.2015 10:56
Сохранение hash-массива в cookie Dorian_bs Общие вопросы Javascript 2 03.06.2012 17:02