Запоминать cookie при клике

Question

Прошу помощи в доработки скрипта.

Есть скрипт для сайта с алкоголем. При первом заходе на этот сайт всплывает окно. Если в этом окне нажать "Нет", то идёт переход в гугл. Если вернуться на страницу "18+" снова, то страница показывается уже без всплывающего окна.

Чуть ниже второй код, который я пытался доработать, но всплывающее окно показывается при каждом обновлении страницы, в независимости от ответа пользователя. (вариант работающего скрипта взят отсюда kvz1926.ru/js/scripts.js)

(function($) {
    $(function() {
        // Проверим, есть ли запись в куках о посещении посетителя
        // Если запись есть - ничего не делаем
        if (!$.cookie('was')) {
            // Покажем всплывающее окно
            $('#boxUserFirstInfo').arcticmodal({
                    closeOnOverlayClick: false,
                    closeOnEsc: true
            });
        }

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

Пример доработанного кода (.yes-click - ответ, что есть 18, а .no-click, что нет 18)

Вопрос такой: Как сделать так, чтобы при нажатии .yes-click куки запоминались?

(function($) {
    $(function() {
        // Проверим, есть ли запись в куках о посещении посетителя
        // Если запись есть - ничего не делаем
        if (!$.cookie('was')) {
            // Покажем всплывающее окно
            $('#boxUserFirstInfo').arcticmodal({
                closeOnOverlayClick: false,
                closeOnEsc: true
            });
        }

        $('.no-click').click(function() {
            window.location.href = 'http://www.google.ru/';
            return false
        });

        $('.yes-click').click(function() {
            $.cookie(cookie, 'was', {
                expires: 365,
                path: '/'
            });
            return false
        })
    })
})(jQuery)

$.cookie(cookie, 'was', { первый параметр точно нужен? — Mikhail Vaysman, Jan 26 '17 at 11:57
@MikhailVaysman изучаю вот js, не до конца вник в синтаксис =( делаю по примерам — Mimzik, Jan 26 '17 at 12:05
а почему при копировании примера код вдруг поменялся? — Grundy, Jan 26 '17 at 12:11

score 1 · Answer 1 · answered Jan 26 '17 at 12:08

1

Замените на вот такой код

$('.yes-click').click(function() {
    $.cookie('was', true, {
        expires: 365,
        path: '/'
    });
    return false
})

answered Jan 26 '17 at 12:08

Mikhail Vaysman

14,256

то что нужно, но можете пояснить почему первый пример использует вырезанную часть кода – Mimzik Jan 26 '17 at 22:21
какой именно пример? и про какую часть кода вы спрашиваете? – Mikhail Vaysman Jan 26 '17 at 22:50
первый код в моём вопросе =) – Mimzik Jan 26 '17 at 23:38
а что такое вырезанная часть кода? первый пример, просто проверяет есть ли у пользователя cookie или нет. если нет, то показывает окно и устанавливает cookie. если cookie есть, то просто обновляет дату окончания хранения cookie. – Mikhail Vaysman Jan 26 '17 at 23:58

score 1 · Answer 2 · answered Aug 10 '18 at 07:14

Писал подобный скрипт, но на localStorage, вот, если нужно

P.s. Тут работать не будет, только "у себя".

// Лучше добавить в <head>
$(document).ready(function(){
  if(localStorage.getItem('ConfirmationOfAge')=='1') 
  $('#COA').remove();
});
$('#COA').find('.COA-button button').on('click',function(){
  if($(this).hasClass('COA-button--yes')){
    localStorage.setItem('ConfirmationOfAge','1');
    $('#COA').remove();
  }
  if($(this).hasClass('COA-button--no'))
    location.href = 'http://www.google.com/';
});

#COA {
  z-index: 9999;
  color: #fff;
}
#COA,
#COA .COA-overlay {
  display: block;
  width: 100%;
  height: 100%;
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}

#COA .COA-overlay {
  background: #bdc3c7;
}
#COA .COA-form {
  display: block;
  width: 600px;
  height: 135px;
  background: #2b2b2b;
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  padding: 20px;
  border-radius: 5px;
  text-align: center;
}
#COA .COA-form .COA-mess {
  font-size: 14px;
  line-height: 1.5;
}
#COA .COA-form .COA-button {
  margin-top: 10px;
}
#COA .COA-form .COA-button button {
  display: inline-block;
  width: 100px;
  height: 40px;
  border-radius: 5px;
  color: #fff;
  font-weight: bold;
  border: 0;
  cursor: pointer;
}
#COA .COA-form .COA-button button:hover {
  box-shadow: 0 0 2px 1px #fff;
}
#COA .COA-form .COA-button button.COA-button--yes {
  background-color: #2ecc71;
  margin-right: 5px;
}
#COA .COA-form .COA-button button.COA-button--no {
  background-color: #e74c3c;
  margin-left: 5px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<!-- в конец <body> -->

<div id="COA">
<div class="COA-overlay"></div>
<div class="COA-form">
<div class="COA-mess">
Данный сайт может содержать контент, предназначенный для лиц старше 18 лет.<br>
Чтобы продолжить, подтвердите возраст.<br><br>
Вам уже есть 18?
</div>
<div class="COA-button">
<button class="COA-button--yes">Да</button>
<button class="COA-button--no">Нет</button>
</div>
</div>
</div>

Запоминать cookie при клике

2 Answers2