Как подключить cookie js на показ сообщения 1 раз?

Question

[Darklt]

Есть скрипт окна по умолчанию открыто:

<div  class="personal-data-warning" id="block_id">ОКНО<a class="black personal-data-warning-close" onclick="diplay_hide('#block_id');return false;" ></a></div>

Закрытие:

function diplay_hide (blockId)

{ 
    if ($(blockId).css('display') == 'none') 
        { 
            $(blockId).animate({height: 'show'}, 500); 
        } 
    else 
        {     
            $(blockId).animate({height: 'hide'}, 500); 
        }


}

Подключил библиотеку jquery.cookie.min.js

Но не могу разобраться как поставить $.cookie чтобы только 1 раз показывалось посетителю

Answer 1

[Антон]

Засуньте ключ:значение в локал сторейдж и проверяйте эту пару каждый раз, если есть - не показывать, если нету - записать и показать

Comments

[Darklt]

А поподробнее? я в JS не силен

[Антон]

Darklt, Вот Вам и цель, изучайте, пытайтесь, в этом и есть сила обучения, когда добиваешься решения сам, и в голове уляжется надолго. В какую сторону копать, я Вам подсказал, а далее, открывайте документацию по работе с LocalStorage и пытайтесь

Answer 2

[Евгений Калибров]

function diplay_hide (blockId)
{ 
    if ($.cookie('isShowPopup')) return false;
    if ($(blockId).css('display') == 'none') 
        { 
            $(blockId).animate({height: 'show'}, 500); 
            $.cookie('isShowPopup', '1');
        } 
    else 
        {     
            $(blockId).animate({height: 'hide'}, 500); 
        }


}

Comments

[Darklt]

TypeError: $.cookie is not a function

[Евгений Калибров]

Значит не подключили библиотеку

[Darklt]

подключена

<script src="//yandex.st/jquery/cookie/1.0/jquery.cookie.min.js"></script>

Второй скрипт вот так работает, не ругает.

(function($) {
$(function() {

  // Проверим, есть ли запись в куках о посещении посетителя
  // Если запись есть - ничего не делаем
  if (!$.cookie('was')) {

    // Покажем всплывающее окно
    $('#boxUserFirstInfo').arcticmodal({
      closeOnOverlayClick: false,
      closeOnEsc: true
    });

  }

  // Запомним в куках, что посетитель к нам уже заходил
  $.cookie('was', true, {
    expires: 365,
    path: '/'
  });

})
})(jQuery)

[Евгений Калибров]

проверьте последовательность подключения скриптов, jquery.cookie.min.js должен идти после подключения jquery, но до ваших скриптов.

[Евгений Калибров]

А вообще используйте localStorage:

function diplay_hide (blockId)
{ 
    if (localStorage.getItem('isShowPopup')) return false;
    if ($(blockId).css('display') == 'none') 
        { 
            $(blockId).animate({height: 'show'}, 500); 
            localStorage.setItem('isShowPopup', '1');
        } 
    else 
        {     
            $(blockId).animate({height: 'hide'}, 500); 
        }


}

[Darklt]

Ошибку не выдаёт, но и никакого эффекта не появилось, при F5 также открывает окно :(

[Евгений Калибров]

Darklt скорее всего связано с каким-то другим кодом, получилось разобраться?

Answer 3

[Andreo]

Перед показом проверяйте наличие куки. Если их нет то устанавливаем и показываем что вам там надо...

if(!$.cookie('checker')) {
    $.cookie('checker', 1, {
        expires: 30
    });
    $(blockId).animate({height: 'show'}, 500);
}

Для блока .personal-data-warning в css устанавливаем свойство display: none

Comments

[Darklt]

Спасибо, но не может найти функцию кук. TypeError: $.cookie is not a function
[Подробнее]

[Andreo]

Качаем отсюда и подключаем:

[Darklt]

подключил, тоже самое :(

[Andreo]

Ну если функция не найдена, значит не подключили.
Повнимательнее...

[Darklt]

1.

<script src="//yandex.st/jquery/1.9.1/jquery.min.js"></script>

2. <script src="jquery.cookie.js"></script>
3. скрипты, дело в том что в таком образе на $.cookie не ругается:

<script>
  (function($) {
    $(function() {
      if (!$.cookie('smartCookies')) {
 
        function getWindow(){
          $('.offer').arcticmodal({
            closeOnOverlayClick: false,
            closeOnEsc: true
          });
        };
 
        setTimeout (getWindow, 5000);
      }
 
      $.cookie('smartCookies', true, {
        expires: 180, 
        path: '/'
      });
 
    })
  })(jQuery)
</script>

[Andreo]

Проверьте чтоб ваш jquery.cookie.js подключался раньше чем выполнялся скрипт.

[Darklt]

так и есть, скрипты в самом конце, а подключение в head

[Andreo]

Darklt, Да. Ну я тогда не знаю что у вас там не так...
Пример кода я вам привел - он даже рабочий. Что там за тараканы в вашем коде я не знаю. Работайте

[Darklt]

ну всё равно не может найти куки. через localStorage вообще ничего не происходит

[Andreo]

Открывайте консоль и шуршите что у вас не так.