带Cookie的js计时器

Question

我需要帮助来实现带有cookie的计时器。重新加载页面后，计时器将从其停止处继续运行。我使用jQuery和一个插件来做到这一点：jquery.cookie

计时器启动时，链接处于活动状态后将被禁用。只需要几分钟和几秒钟。 Cookie +的生命周期为5分钟。

Google没有帮助。我要求分享您的选择或帮助您编写自己的选择。

var date = new Date();
var now = date.getMinutes();
var endTime = date.getMinutes() + 1;

if ($.cookie("timerMSG") == null) {
  $.cookie("timerMSG", endTime);
}

$(document).ready(function() {
  $('.link-item').on("click", function() {
    var _Seconds = ($.cookie("timerMSG") - now) * 60;
    $('.link-item').addClass("disable");
    $('.timer').removeClass("disable");

    var timer = setInterval(function() {
      if (_Seconds > 0) {
        _Seconds--;
        $('.second').text(_Seconds);
        $.cookie('my-cookie', _Seconds);
      } else {
        clearInterval(timer);
        $('.timer').addClass("disable");
        $('.link-item').removeClass("disable");
      }
    }, 1000);
  });
});

.link {
  margin-top: 100px;
  text-align: center;
  width: 100%;
  height: 150px;
  background-color: #a38080;
}

.link-item {
  font-size: 28px;
  font-family: 'Courier New', Courier, monospace;
  font-weight: 300;
}

a {
  text-decoration: none;
  color: #222;
}

.timer {
  font-size: 28px;
  font-family: 'Courier New', Courier, monospace;
  font-weight: 300;
  color: rgb(190, 190, 190);
}

.disable {
  display: none;
}

a:hover {
  color: rgb(128, 255, 249);
  text-decoration: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="container">
  <div class="link col-md-12">
    <a href="#" class="link-item ">Go</a>
    <span class="timer disable">
      <span class="minets "></span> 
      min
    </span>
    <span class="second "></span> 
    sec
    </span>
  </div>
</div>