如何指定 cookie 在整个站点上显示直到关闭？

Question

我制作了一个 div 每天为用户显示一次直到他关闭它，但我遇到的问题是在去购物并返回开始站点后它会自动关闭。

我想要一些解决此问题的建议。

我尝试使用 document.cookie = 'hidecookier=1; domain=; expires=... 而不是 document.cookie ='hidecookie=1; path=/; expires=... 将 domain= 而非 path= 后，我无法再关闭 div，它一直呆在那里直到页面刷新或直到去购物并返回开始站点。

$(function() {
  $('#header').trigger('onload');
});

function setCookieHeaderCounter() {
  if (document.cookie.indexOf('cookieheaderCounter=2') === -1) {
    if (document.cookie.indexOf('cookieheaderCounter=1') === -1) {
      document.cookie = 'cookieheaderCounter=1; path=/;';

    } else if (document.cookie.indexOf('cookieheaderCounter=1') !== -1) {
      document.cookie = 'cookieheaderCounter=2; path=/;';
    }
  }
}

function setCookieHeader() {
  var ablauf = new Date();
  var inXTagen = ablauf.getTime() + (24 * 60 * 60 * 1000); // 1 Tage
  ablauf.setTime(inXTagen);
  document.cookie = 'hidecookieheader=1; domain=; expires=' + ablauf.toGMTString();
}

if (document.cookie.indexOf('hidecookieheader=1') !== -1 || document.cookie.indexOf('cookieheaderCounter=2') !== -1) {
  jQuery('#header').hide();
} else {
  jQuery('#header').prependTo('meta_navi');
  jQuery('.header').show();
}

<div id="header" onload="setCookieHeaderCounter()">
  <span style="font-weight: bold;"><a class="header" href=""><b></b></a></span>
  <div class="close-btn"><span id="close" class="" onclick="setCookieHeader();jQuery('#header').slideUp" style="margin-top: -8px; float: right; color: #fff; font-size: 23px;"></span></div>
</div>

明确地说，我想在整个网站上显示 div #header，直到有人用 span #hinweis-close 关闭它。它可以在刷新时消失，没关系。

Answer 1

通过添加 <script src="https://cdnjs.cloudflare.com/ajax/libs/js-cookie/2.2.0/js.cookie.min.js"></script>

https://github.com/js-cookie/js-cookie

使用此代码DEMO

$(function() {
  var closed = Cookies.get('hinweis');
  if (!closed) {
    $('#hinweis_header').show();
  } 

  $('#hinweis-close').on('click',function() {
    Cookies.set('hinweis', 'seen');
    $('#hinweis_header').slideUp();
  });
});

#hinweis-close {
  margin-top: -8px;
  float: right;
  color: #fff;
  font-size: 23px;
}
#hinweis_header { display:none }

<div id="hinweis_header">
  <b><a class="hinweis-header" href="<?=SHOP_URL_HTTPS?>/<?=$param["links"]["service"]?>/<?=$sprachdatei["links"]["link_hinweis"]?>">Nur heute: 10 % auf alle Jersey Stoffe >><?=$sprachdatei['header']['hinweis_header']?></a></b>

  <div class="close-btn"><span id="hinweis-close" class="rwd-buttinette-icon rwd-icon-remove-circle-1"></span></div>
</div>

如何指定 cookie 在整个站点上显示直到关闭？

How to specify cookie to show on whole site until closed?

javascript

cookies

jquery

jquery-cookie