每次刷新后,javascript中的cookie都会重新启动

时间:2018-01-06 09:55:45

标签: javascript jquery cookies

我在每个产品页面上使用此计时器:http://www.screencast.com/t/hsmzVOLBUJ 和产品页面URL的示例: https://www.tresor-ethnique.com/collections/celtique/products/pendentif-chene-millenaire

从12点4分26秒开始然后减少。 我希望它能够设置一个cookie,这样当用户在不同的产品页面之间导航时,它会不断地从其他页面的值中减少;如果用户在12小时后回来,它会显示0小时4分26秒。

所以我对javascript中的cookie集成有点不熟悉,这会出现在我的代码的末尾: document.cookie = 'myClock='

到目前为止,计时器在每次刷新后重置

你有什么想法可以阻止吗? 这将是一个很大的帮助,非常感谢你:)

<div id="clockdiv">
<span class="days"></span><div class="smalltext">jours</div>
<span class="hours"></span><div class="smalltext">hrs</div>
<span class="minutes"></span><div class="smalltext">mins</div>
<span class="seconds"></span><div class="smalltext">secs</div>
</div>

<script type="text/javascript">

function getTimeRemaining(endtime) {
  var t = Date.parse(endtime) - Date.parse(new Date());
  var seconds = Math.floor((t / 1000) % 60);
  var minutes = Math.floor((t / 1000 / 60) % 60);
  var hours = Math.floor((t / (1000 * 60 * 60)) % 24);
  var days = Math.floor(t / (1000 * 60 * 60 * 24));
  return {
    'total': t,
    'days': days,
    'hours': hours,
    'minutes': minutes,
    'seconds': seconds
  };
}

function initializeClock(id, endtime) {
  var clock = document.getElementById(id);
  var daysSpan = clock.querySelector('.days');
  var hoursSpan = clock.querySelector('.hours');
  var minutesSpan = clock.querySelector('.minutes');
  var secondsSpan = clock.querySelector('.seconds');

  function updateClock() {
    var t = getTimeRemaining(endtime);

    daysSpan.innerHTML = t.days;
    hoursSpan.innerHTML = ('0' + t.hours).slice(-2);
    minutesSpan.innerHTML = ('0' + t.minutes).slice(-2);
    secondsSpan.innerHTML = ('0' + t.seconds).slice(-2);

    if (t.total <= 0) {
      clearInterval(timeinterval);
    }
  }

  updateClock();
  var timeinterval = setInterval(updateClock, 1000);
}
var currentTime = Date.parse(new Date());
if(document.cookie && document.cookie.match('myClock')){
  var deadline = document.cookie.match(/(^|;)myClock=([^;]+)/)[2];
}
else{
var timeInHours = 12;
var timeInMinutes = 4;
var timeInSeconds = 26;
var currentTime = Date.parse(new Date());
var deadline = new Date(currentTime + timeInHours*60*60*1000 + timeInMinutes*60*1000 +  timeInSeconds*1000);
  document.cookie = 'myClock=' + deadline + '; path=/; domain= .https://www.tresor-ethnique.com/';
initializeClock('clockdiv', deadline);
}
</script>

0 个答案:

没有答案