我希望有一种方法可以在倒计时器开始之前设置延迟。显示第一条加载的消息一段时间,然后开始倒计时。 我只想使用 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>
最佳答案
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
关于javascript - 如何延迟倒计时开始?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29887352/