Question

我的儿子在申请大学课程时试图让这段代码工作。他需要从Youtube示例中解释它是如何工作的。他有的问题＆amp;我有没有让代码运行。

Youtube他正在努力的例子。的 https://www.youtube.com/watch?v=u_6CqjQ-L8Q&authuser=0

这应该是一个从10到零的简单倒数计时器 - 任何想法我做错了。使用Notepad ++创建示例＆amp;运行

<script type="text/javascript">
function countdown(secs,elem)  {
    var element = document.getElementById(elem);
    element.innerHTML = "Please wait for "+secs+" seconds";
    if(secs<1){
        clearTimeout(timer);
        element.innerHTML = '<h2>Countdown Complete!</h2>';
        element.innerHTML += '<a href="#">Click here now</a>';
    }   
    secs = secs--;
    var timer = setTimeout('countDown('+secs+',"'+elem+'")',1000);
}
</script>
<div id="status"></div>
<script type="text/javascript">countdown(10,"status");</script>

Answer 1

一些问题：

secs = secs--不会修改secs。只需secs--即可。
该功能的拼写不一致

还有一些问题，这些问题也出现在您提供的链接中：

当计时器停止时，代码仍会继续调用setTimeout
此代码使用错误做法将字符串传递给setTimeout，同时完全可以传递函数。
调用clearTimeout在发生这种情况时毫无用处，因为当时没有待处理的。{/ li>

工作代码：

＆＃13;

function countdown(secs,elem)  {
    var element = document.getElementById(elem);
    if(secs<1){
        element.innerHTML = '<h2>Countdown Complete!</h2>'
                          + '<a href="#">Click here now</a>';
        return; // <---- don't call setTimeout again
    }   
    element.textContent = "Please wait for "+secs+" seconds";
    // Spelling of countdown is important. Don't use string, but bind:
    setTimeout(countdown.bind(null, secs-1, elem), 1000);
}

countdown(10, 'status');

＆＃13;

<div id="status"></div>

＆＃13;

无法让简单的倒计时程序运行

1 个答案: