刷新页面时不会删除历史日志,或者历史日志将其值存储在电子表格中



我创建了一个简单的计数器,它有一个文本框、禁用框和一个历史记录,用于记录禁用框中以前的所有值。

它工作得很好,但不知何故,当页面意外刷新时,所有日志都会被删除。

即使页面重新加载,也有办法保留该记录吗?或者可能将其存储在电子表格中?

let box1 = document.getElementById("box1");
let box2 = document.getElementById("box2");
let resetBtn = document.getElementById("reset");
let historyContainer = document.getElementById("history");
let history = [];
//listen key enter press on the input
box1.addEventListener("keyup", e => {
if (e.key === "Enter" && e.target.value !== "") {
const summedValue = (box2.value && box2.value.trim() === "")  ? Number(box2.value) : Number(box2.value) + Number(e.target.value)
box2.value = summedValue;
historyContainer.innerHTML += `<p>${box2.value}</p>`;
box1.value = "";
}
});
//reset the second box and
resetBtn.addEventListener("click", () => {
box2.value = "";
historyContainer.innerHTML = ""
});
<input type="number" id="box1" />
<input type="number" id="box2" disabled />
<div id="history">
</div>
<button type="button" id="reset">
Reset
</button>

您可以从web浏览器的本地存储中存储和检索这些数据。了解更多信息

最新更新