Question

我想在倒数计时器开始前设置延迟。显示第一个加载的消息一段时间，然后开始倒计时。我想只使用javascript，没有jquery。我已经尝试过setTimeout方法，但无法在此代码中使用它。

<!DOCTYPE html>
<html>
<head>

<style>

html{background-color: #444}
body{color: cyan;}
img{width: 100%; max-width: 256px; height: auto;}
#example3div{border: 1px solid; padding: 10px; border-radius: 50%; font-size:     22px; width: 80%; text-align: center;  margin: auto;}

</style>

<script type="text/javascript">

var containerID = "example3div";
var number = 6;
var timerID = setInterval("CountdownTimer()",1000);

function CountdownTimer() {     
    if(number > 1){
    number--;
    ReplaceContentInContainer(containerID,number);
    }
    else
    {
    clearInterval(timerID);
    ReplaceContentInContainer(containerID,'<img alt="GREATHOMES.US"     src="http://greathomes.us/images/html5.png" /><p>Hello. I love learning how to     code! (-_-)</p>');
}
}
</script>

<script type="text/javascript">
function ReplaceContentInContainer(id,content) {
    var container = document.getElementById(id);
container.innerHTML = content;
}
</script>

</head>
<body>

<div id="example3div">Get ready for the countdown of your life!!!</div>

</body>
</html>

Answer 1

setTimeout非常容易处理，与您现有的setInterval实际上完全相同，这是一个例子：

setTimeout(CountdownTimer,2000);//call this after 2000ms

function CountdownTimer(){
   //your countdown timer code
}

请记住setInterval延迟第一次执行它的内容 - 等于它的指定间隔 - 它在调用后不会立即触发

@Deb说，你也有一个拼写错误 - 它是：

var timerID = setInterval(CountdownTimer,1000); //functions calls are not specified in string format

Answer 2

错误是：

只需更改代码

即可

var timerID = setInterval("CountdownTimer()",1000);

到

var timerID = setInterval(CountdownTimer,1000);

Answer 3

鉴于您的实际代码，它看起来像你想要的

var timerID = setInterval("CountdownTimer()",1000);

成为

var timerID;
setTimeout(function(){
    timerID = setInterval("CountdownTimer()",1000)
}, n);  // Where n is the number of milliseconds to wait

如何延迟倒计时的开始？

3 个答案: