倒计时功能实际上没有倒计时

Question

1. 我在我的.js文件中有一个函数，它应该显示10-0的倒计时。一旦点击0，就会打开第二页。我还没有打开页面的部分，但这不是我当前的问题。我的问题是倒计时会显示数字1，而不做其他事情。我不太确定为什么。
2. 这是倒计时功能 函数startCountdown() { for (var i= 10；i >= 0；i-){document.getElementById(“倒计时”).value= i；}
3. 下面是调用它的函数 函数startAdPage() { setInterval(changeAd()，2000)；setInterval(startCountdown()，1000)；}
4. 最后，这里是它要发送的HTML代码。一切都是通过调用onload方法的body标记启动的。我知道这个部分起作用，因为我让它做一些正常工作的事情。

Answer 1

setInterval的第一个参数是函数。不是传递函数，而是调用函数并传递它返回的任何内容，因为函数名后面有()。

而且，您不会在倒计时字段的更新之间等待。Javascript是单线程的，直到脚本返回，页面才会更新。你需要这个：

function startAdPage(){
    var curCounter = 10;
    function startCountdown() {
        document.getElementById("countdown").value = curCounter;
        curCounter--;
        if (curCounter == 0) {
            clearInterval(countdownInterval);
        }
    }
    setInterval(changeAd, 2000);
    var countdownInterval = setInterval(startCountdown, 1000);

}

Answer 2

startCountdown中的循环一直运行到循环的末尾，因此值最终为0。另外，您应该在没有参数的情况下将匿名函数或未执行的函数传递给setInterval和clearInterval。当您在函数名的末尾添加()时，您将执行该函数。将<input type='text' class='countdown' />更改为<input type='text' id='countdown' />，然后尝试以下操作：

function countdown(begin, end, interval, outputElement){
  var repeat = setInterval(function(){
    if(outputElement.innerHTML){
      outputElement.innerHTML = begin--;
    }
    else{
      outputElement.value = begin--;
    }  
    if(begin === end)clearInterval(repeat);
  }, interval);
}
countdown(10, 0, 1000, document.getElementById('countdown'));