我做了一个javascript计时器(实际上是复制并做了一些更改(，但我不知道如何做到这一点，如果我刷新页面，计时器计数。。。
你可以在这里找到代码：
var ms = 0, s = 0, m = 60;
var timer;
var stopwatchEl = document.querySelector('.stopwatch');
var lapsContainer = document.querySelector('.laps');
function start() {
if (!timer) {
timer = setInterval(run, 10);
}
}
function run() {
stopwatchEl.textContent = (m < 10 ? "0" + m : m) + ":" + (s < 10 ? "0" + s : s) + ":" + (ms < 10 ? "0" + ms : ms);
ms--;
if (ms < 0) {
ms = 99;
s--;
}
if (s < 0) {
s = 59;
m--;
}
if(m==0 && s==0 && ms==0) {
pause();
var figyelmeztetes = confirm("Lejárt az idő!");
}
stopwatchEl.textContent = (m < 10 ? "0" + m : m) + ":" + (s < 10 ? "0" + s : s) + ":" + (ms < 10 ? "0" + ms : ms);
}
function pause() {
clearInterval(timer);
timer = false;
}
function stop() {
var figyelmeztetes = confirm("Vigyázz!!! Ezzel a számláló visszaáll 60 percre!");
if(figyelmeztetes == true) {
clearInterval(timer);
timer = false;
ms = 0;
s = 0;
m = 60;
stopwatchEl.textContent = (m < 10 ? "0" + m : m) + ":" + (s < 10 ? "0" + s : s) + ":" + (ms < 10 ? "0" + ms : ms);
}
}.controls {
display: flex;
}<div class="controls">
<div onclick="start()">Start</div>
<div onclick="pause()">Pause</div>
<div onclick="stop()">Restart</div>
</div>
<div class="stopwatch">60:00:00</div>有什么简单的方法可以做我想要的吗？
谢谢你的帮助！
您可以设置窗口在本地存储中卸载之前的时间值，如
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<div class="controls">
<button onclick="start()">Start</button>
<button onclick="pause()">Pause</button>
<button onclick="stop()">Restart</button>
</div>
<div class="stopwatch">60:00:00</div>
</body>
</html>
var ms = 0,
s = 0,
m = 60;
var isCountingDown = false;
var timer;
window.addEventListener("load", function () {
if (window.localStorage.getItem("time") !== null) {
let obj = JSON.parse(window.localStorage.getItem("time"));
s = obj["s"];
ms = obj["ms"];
m = obj["m"];
stopwatchEl.textContent = `${m}:${s}:${ms}`;
start();
}
});
window.addEventListener("beforeunload", function () {
if (isCountingDown == true) {
pause();
let obj = {
ms: ms,
s: s,
m: m,
};
window.localStorage.setItem("time", JSON.stringify(obj));
}
});
var stopwatchEl = document.querySelector(".stopwatch");
var lapsContainer = document.querySelector(".laps");
function start() {
if (!timer) {
isCountingDown = true;
timer = setInterval(run, 10);
}
}
function run() {
stopwatchEl.textContent =
(m < 10 ? "0" + m : m) +
":" +
(s < 10 ? "0" + s : s) +
":" +
(ms < 10 ? "0" + ms : ms);
ms--;
if (ms < 0) {
ms = 99;
s--;
}
if (s < 0) {
s = 59;
m--;
}
if (m == 0 && s == 0 && ms == 0) {
pause();
var figyelmeztetes = confirm("Lejárt az idő!");
}
stopwatchEl.textContent =
(m < 10 ? "0" + m : m) +
":" +
(s < 10 ? "0" + s : s) +
":" +
(ms < 10 ? "0" + ms : ms);
}
function pause() {
clearInterval(timer);
timer = false;
}
function stop() {
var figyelmeztetes = confirm(
"Vigyázz!!! Ezzel a számláló visszaáll 60 percre!"
);
if (figyelmeztetes == true) {
clearInterval(timer);
timer = false;
ms = 0;
s = 0;
m = 60;
stopwatchEl.textContent =
(m < 10 ? "0" + m : m) +
":" +
(s < 10 ? "0" + s : s) +
":" +
(ms < 10 ? "0" + ms : ms);
}
}
您可以尝试将剩余时间存储在localStorage中，并在页面加载时引用该时间