使用相同的按钮

时间:2017-08-29 20:40:34

标签: javascript jquery

在这里输入代码我正在尝试在JavaScript中构建一种计时器,我正在努力使其在单击一个按钮时启动setInterval以启动计时器,当我再次单击它时间隔被清除(clearInterval())。这是我到目前为止所尝试的,但我不知道如何使其发挥作用。

$(function(){

var s,min,status,type,interval;

$('#display').on('click', function(){

  function clock(){
    s -= 1;
    if(s<0){
      s = 59;
      min -= 1;
    }
    if(min == 0 && s == 0){
      s = 59;
      min = parseInt($('#break-length').text())-1;
    }
    console.log(min,s);
  }

  if(status == 'active'){
    clearInterval(interval);
  }

  if(!status || status == 'not active'){
    status = 'active';
    type = 'session'
    s = 60;
    min = parseInt($('#session-length').text())-1;  
    interval = setInterval(function(){clock()},1000)
  }

  status = 'not active';

});

});

1 个答案:

答案 0 :(得分:0)

在点击功能结束时,您始终将状态设置为“未激活”状态。试试这个:

  if(status == 'active'){
    clearInterval(interval);
    status = 'not active';
  } else {
    status = 'active';
    type = 'session'
    s = 60;
    min = parseInt($('#session-length').text())-1;  
    interval = setInterval(function(){clock()},1000)
  }