Как правильно выполнить скрипт Jquery cookie?

Question

[Vaha Vaynahskiy]

Задача такая, нужно считать количество акции и вывести их в одном блоке цифрой, после перехода на раздел "акции", нужно обнулить это число и записать данные в куки - с этим разобрался

var x = $('.akcii.item').length;
var b = '<span>' + x + '</span>';
$('.akc.menu-item a').append(b);

После код куки

function getCookie() {
var cookies = document.cookie.match ( '(^|;) ?adultconfirmed=([^;]*)(;|$)' );
if (cookies) { $('.akc.menu-item a span').html('0'); }
}
if(window.location.toString().indexOf('/akcii/')>0){
document.cookie = 'adultconfirmed=yes; path=/; expires=01/01/2100 00:00:00';
$('.akc.menu-item a span').html('0');
};

getCookie();

После перехода на страницу акции число обнуляется и сохраняется в кэше, как сделать так, чтобы при добавлении новой акции, к 0 прибавлялось 1. Т.е. пользователь зашел на сайт, видит количество новых акций "4", после перехода на страницу акции = 0, и при добавлении новой акции (кэш сохранился ж, и блок обнуляется) к 0 прибавлялось 1, после очистки кэша значение будет 5 (4 старые акции и 1 новая)

Answer 1

[Владимир Проскурин]

Как-то так. https://jsfiddle.net/ch51d9mh/
Добавил туда кнопки, которые будут выполнять действия (т.к. в jsfiddle не реализовать многостраничность). Кнопка "Сделать акции прочитанными" выполняет функцию setReadStock, которая запоминает номер последней просмотренной акции. Вторая кнопка просто добавляет акции, ее можете удалить, т.к. как я понял, акции у вас добавляются на сервере.

<div class="stock">
  <div class="stock__item" data-id="1">Акция 1</div>
  <div class="stock__item" data-id="2">Акция 2</div>
  <div class="stock__item" data-id="3">Акция 3</div>
</div>

<div class="count-actions">
  <p>
  Непрочитанных акций <span class="count-actions__value">0</span>
  Последняя прочитанная акция <span class="count-actions__read">0</span>
  </p>
</div>
<div class="buttons">
  <input type="button" class="buttons__item" value="Сделать акции прочитанными" id="set_read">
  <input type="button" class="buttons__item" value="Добавить акцию" id="add_stock">
</div>

// ID последней сохраненной акции
function getLastSaveStockID() {
  var stockId = getCookie('last_stock_id');
  if(stockId === undefined) {
     return 0;
  }
  return stockId; 
}
// ID последней выведенной акции
function getLastStockID() {
  var ids = $('.stock__item').map(function() {
    return this.dataset['id'];
  }).toArray();
  return Math.max.apply(null, ids);
}
// Количество акций, у которых id больше last_id
function getStockCount(last_id) {
  return $('.stock__item').map(function() { 
   if(+this.dataset['id'] > last_id) {
      return this;
   } 
  }).length;
}
// Делать все акции прочитанными
function setReadStock() {
  var last_id = getLastStockID();
  var last_read_id = getLastSaveStockID();
  if(+last_id > last_read_id) {
  	setCookie('last_stock_id', last_id);
  }
}
// Добавление акции
function addStock() {
  var last_id = getLastStockID();
  var new_id = last_id + 1;
  $('.stock').append('<div class="stock__item" data-id="' + new_id +'">Акция ' + new_id + '</div>');
  printCountStock();
}
// Отображаем кол-во новых акций
function printCountStock() {
  var last_id = getLastSaveStockID();
  var stockCount = getStockCount(last_id);
  
  jQuery('.count-actions__value').html(stockCount);
  jQuery('.count-actions__read').html(last_id);
}
// При загрузке страницы выводим кол-во новых акций.
printCountStock();
 
document.getElementById('set_read').addEventListener('click', function() {
  setReadStock();
  printCountStock();
});
document.getElementById('add_stock').addEventListener('click', addStock);

// Установка кукисов
function setCookie(name, value, options) {
  options = options || {};

  var expires = options.expires;

  if (typeof expires == "number" && expires) {
    var d = new Date();
    d.setTime(d.getTime() + expires * 1000);
    expires = options.expires = d;
  }
  if (expires && expires.toUTCString) {
    options.expires = expires.toUTCString();
  }

  value = encodeURIComponent(value);

  var updatedCookie = name + "=" + value;

  for (var propName in options) {
    updatedCookie += "; " + propName;
    var propValue = options[propName];
    if (propValue !== true) {
      updatedCookie += "=" + propValue;
    }
  }

  document.cookie = updatedCookie;
}
// возвращает cookie с именем name, если есть, если нет, то undefined
function getCookie(name) {
  var matches = document.cookie.match(new RegExp(
    "(?:^|; )" + name.replace(/([\.$?*|{}\(\)\[\]\\\/\+^])/g, '\\$1') + "=([^;]*)"
  ));
  return matches ? decodeURIComponent(matches[1]) : undefined;
}

Comments

[Vaha Vaynahskiy]

Большое вам спасибо, все работает. Подстроил код под себя в php, сильно благодарен!!!