JavaScript 中的倒计时,变量
Countdown in JavaScript with variable
我正在使用 CreateJS / EaselJS 构建我的内容。
我想插入一个短暂的延迟,直到用户可以使用一些额外的内容。显示剩余时间很重要!
我的解决方案:
myLabel.text = "5";
setTimeout(function(){ myLabel.text = "4";
setTimeout(function(){ myLabel.text = "3";
setTimeout(function(){ myLabel.text = "2";
setTimeout(function(){ myLabel.text = "1";
setTimeout(function(){
myLabel.text = "0";
myButton.addEventListener('click', myFunction);
}, 1000);
}, 1000);
}, 1000);
}, 1000);
}, 1000);
可以用更短的代码吗?
奖励:传递一个变量作为倒计时持续时间(例如 5000,持续 5 秒)
西蒙,我希望能尽快得到答复
当你想开始倒计时时调用递减函数。
var remaining = 5;
function decrement(){
myLabel.text = remaining;
remaining--;
if(remaining >= 0){
setTimeout(decrement, 1000);
}
}
改用setInterval
:
var myNumber = 5;
myLabel.text = myNumber;
var myInterval = setInterval(function() {
myLabel.text = --myNumber;
if (myNumber === 0) {
myButton.addEventListener('click', myFunction);
clearInterval(myInterval);
}
}, 1000);
此代码创建倒计时 (fiddle):
<div id="myLabel"></div>
var myLabel = document.getElementById('myLabel');
function countdown(duration) {
myLabel.innerText = duration;
if(duration > 0) {
setTimeout(function() {
countdown(duration - 1);
}, 1000);
} else {
myButton.addEventListener('click', myFunction);
}
}
countdown(8);
我正在使用 CreateJS / EaselJS 构建我的内容。
我想插入一个短暂的延迟,直到用户可以使用一些额外的内容。显示剩余时间很重要!
我的解决方案:
myLabel.text = "5";
setTimeout(function(){ myLabel.text = "4";
setTimeout(function(){ myLabel.text = "3";
setTimeout(function(){ myLabel.text = "2";
setTimeout(function(){ myLabel.text = "1";
setTimeout(function(){
myLabel.text = "0";
myButton.addEventListener('click', myFunction);
}, 1000);
}, 1000);
}, 1000);
}, 1000);
}, 1000);
可以用更短的代码吗?
奖励:传递一个变量作为倒计时持续时间(例如 5000,持续 5 秒)
西蒙,我希望能尽快得到答复
当你想开始倒计时时调用递减函数。
var remaining = 5;
function decrement(){
myLabel.text = remaining;
remaining--;
if(remaining >= 0){
setTimeout(decrement, 1000);
}
}
改用setInterval
:
var myNumber = 5;
myLabel.text = myNumber;
var myInterval = setInterval(function() {
myLabel.text = --myNumber;
if (myNumber === 0) {
myButton.addEventListener('click', myFunction);
clearInterval(myInterval);
}
}, 1000);
此代码创建倒计时 (fiddle):
<div id="myLabel"></div>
var myLabel = document.getElementById('myLabel');
function countdown(duration) {
myLabel.innerText = duration;
if(duration > 0) {
setTimeout(function() {
countdown(duration - 1);
}, 1000);
} else {
myButton.addEventListener('click', myFunction);
}
}
countdown(8);