Question

我正在使用Django，我想创建一个倒数计时器，一旦计时器到达0分钟，就会启用“完成”按钮。单击“完成”后，用户获得积分，现在我应该确保用户仅获得一次积分。我想在使用一次后为用户禁用“完成”按钮。

HTML

<div class="row">
    <span class="col-3" id="countdown">
        <button id="startClock">Start Timer</button>
    </span>
    <span class="col-1"></span>
    <button class="col-2" id="done">Done!</button>
</div>

<script>
$('#done').hide();

jQuery(function($){
   $('#startClock').on('click', doCount);
});

function doCount(){
    var timer2 = "10:01";
    var interval = setInterval(function() {

  var timer = timer2.split(':');
  //by parsing integer, I avoid all extra string processing
  var minutes = parseInt(timer[0], 10);
  var seconds = parseInt(timer[1], 10);
  --seconds;
  minutes = (seconds < 0) ? --minutes : minutes;
  seconds = (seconds < 0) ? 59 : seconds;
  seconds = (seconds < 10) ? '0' + seconds : seconds;
  $('#countdown').html(minutes + ':' + seconds);
  if (minutes < 0)
      clearInterval(interval);
  //check if both minutes and seconds are 0
  if ((seconds <= 0) && (minutes <= 0)){
      clearInterval(interval);
      $('#done').show();
  }

  timer2 = minutes + ':' + seconds;
   }, 1000);
}
</script>

Answer 1

您可以只创建一个变量来跟踪用户是否单击了完成按钮。

let isDone = false;
isDone = true;

您也可以为此使用localStorage。这样，即使用户刷新浏览器也可以访问值。

请注意，可以绕过它，因此请确保您在服务器端进行了某些验证。

示例：

localStorage.setItem("done", true);

希望这会有所帮助！

防止在页面刷新时重置倒数计时器-Django和JS

1 个答案: