我正在编写一个简单的战斗游戏,其中两个玩家选择他们的 Angular 色并进行战斗。战斗分为回合,每个回合从新页面开始,并有一个从99倒数到0的计时器。但是,我不知道如何让计时器在新页面上保留上一回合的时间。每次新回合开始时,计时器都会重置为 99。 有什么办法可以解决这个问题吗?
<script>
let timeLeft = 99;
let elem = document.getElementById('timer');
let timerId = setInterval(countdown, 1000);
function countdown() {
if (timeLeft == -1) {
clearTimeout(timerId);
doSomething();
} else {
elem.innerHTML = timeLeft;
timeLeft--;
}
}
function doSomething() {
alert("Player x loses");
}
</script>
最佳答案
只需设置一个小的 session 变量,并在每个页面加载开始时使用 if 语句检查它。如果 session 变量为空,请将其设置为您想要的值,否则,保留上次运行脚本时的先前值并从最后一个值启动它。
<script>
var timeLeft;
if(!sessionStorage.getItem('timer'){
timeLeft = 99;
} else {
timeLeft = sessionStorage.getItem('timer');
}
let elem = document.getElementById('timer');
let timerId = setInterval(countdown, 1000);
function countdown() {
if (timeLeft == -1) {
clearTimeout(timerId);
doSomething();
} else {
elem.innerHTML = timeLeft;
timeLeft--;
sessionStorage.setItem('timer', timeLeft);
}
}
function doSomething() {
alert("Player x loses");
}
</script>
关于javascript - 倒计时器在新页面上重置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57462557/