Question

我是一名JavaScript新手，我正在尝试构建一个简单的倒数计时器，它只能在几秒钟内倒计时。它显示x的未捕获类型错误。我认为这意味着函数没有递归。代码如下：

function timer(x, elem){
    var elem = document.getElementById(elem);
    elem.innerHTML = x;
    if (x > 0) {
        setTimeout(timer(x-1, elem),1000);
    }
}

Answer 1

您有两个问题：

您正在将elem的值覆盖为DOM元素，然后尝试重用它，就好像它仍然是一个字符串
setTimeout需要一个可以每1000毫秒调用一次的函数。而是调用函数并将结果传递给setTimeout。区别有点令人困惑，但它可能有助于将其分成另一个变量：

这是你目前正在做的事情

var myFuncResult = timer(x-1, elem);   // this returns the result of the function
setTimeOut(myFuncResult, 1000);

相反，你想要

var myFunc = function() { timer(x-1, elem) }; // this returns a function that can be called
setTimeOut(myFunc, 1000);

当然，您可以将此功能直接放入setTimeout，就像您尝试的那样。

以下是您想要的（Hit＆＃34; Run＆＃34;）：

＆＃13;

function timer(x, elem){
    var DOMelem = document.getElementById(elem);
    DOMelem.innerHTML = x;
    if (x > 0) {
        setTimeout(function() {
          timer(x-1, elem)
        },1000);
    }
}

timer(10, "my-timer");

＆＃13;

<div id="my-timer"></div>

＆＃13;

未捕获的TypeError：无法设置属性＆＃39; innerHTML＆＃39; null倒数计时器

1 个答案: