Javascript简单计时器无法正常工作

Question

请帮我解决我的代码。我的问题是计时器结束后，它显示-1：60而不是显示0:00。我尝试了其他方式的else语句，但徒劳无功。 当我将if语句中的条件更改为x> 0时，计时器不会从0:60开始计时。 任何帮助将不胜感激。 我尝试了其他方法，如果没有其他方法，则无济于事。 先感谢您。

<h1  id='session' onClick='general()'>2</h1>

JS：

 var seconds=60;
 var x=document.getElementById('session').innerHTML-1;
 var t;

 function timer(){
   if(x>=0){
      seconds--; 
      if(seconds<10){
         seconds='0'+seconds;
        };
       if(seconds==0){
           x--;
          seconds=60;
         }
        }
    document.getElementById('session').innerHTML=x+':'+seconds;
 }

  function stoptimer(){
       clearInterval(t);
   }

    var on=true;
       function general(){
          if(on){  
                 on=false;
                t = setInterval(timer,200);
          }else{  
              on=true;
               stoptimer();
         }
       }

Answer 1

我为您创建了一个小提琴，它将计时器从60秒倒计时到00。

小提琴 ： https : //jsfiddle.net/njw73naj/

HTML

<h1>
 <span id="min">0</span>
 :
 <span id="sec">00</span>
</h1>

JS

var seconds = 60,
    secondDom = document.getElementById("sec");

secondDom.innerHTML = seconds;

var countdown = function(){
    seconds--;
    if(seconds < 0){
      clearInterval(timer);
    }else{
      secondDom.innerHTML = (seconds < 10 ? "0" + seconds : seconds);
    }
}

var timer = setInterval(countdown,1000);

希望这可以帮助。 :)

Answer 2

我已从您的代码中删除了某些不必要的内容。 不过，您应该知道这实际上不是2分钟。 我的“ setInterval”基于您的原始setInterval。

HTML：

<h1  id='session' onclick='general()'>1</h1>

JS：

<script>
var seconds = 60;
var x = document.getElementById('session').innerHTML;

var t;

function timer(){

    if (x === 0 && seconds === 0)
    {
        stoptimer(t);
    }

    else if(seconds === 0){
        seconds = 60;
        x--;
    }

    else{
        seconds--;
    }

document.getElementById('session').innerHTML = x + ':' + seconds;
}

function stoptimer(){
    clearInterval(t);
}

var on = true;

function general(){
    if(on){  
        on=false;
        t = setInterval(timer,200);
    }else{  
        on=true;
        stoptimer();
    }
}
</script>

Answer 3

问题全是由于计时器功能引起的，因此我对您的函数进行了一些更改，然后将其重写。 我在jsfiddle中运行它，并且正在运行。

function timer(){        
   if(x>=0 && flag==false){
      seconds--; 
      if(seconds<10){
         seconds='0'+seconds;
        };
       if(seconds==0){
           x--;
          seconds=60;
         }
        }
    if (x == -1){
     flag=true;
     x = 0;
     seconds = '00';
    }
    document.getElementById('session').innerHTML=x+':'+seconds;
}

确保使用全局变量var flag=false; 为了正确执行此功能。 这是我创建的jsfiddle的链接： https ://jsfiddle.net/35w4nkzm/1/

我希望有所帮助。