我即将在 Javascript 中编写一些代码（涉及每个代码的循环<input>并添加侦听器）：允许在按键后将所有<input>值保存到localStorage恢复页面/浏览器已关闭并在同一页面上重新打开的情况下的所有<input>值localStorage但也许浏览器提供了一种自动方式？例如，通过添加一个属性<input>，类似于<input autofocus>（此处不相关）问：HTML标签有自动保存功能吗<form> <input>？
3 回答
撒科打诨
TA贡献1934条经验 获得超2个赞
据我所知，没有内置的方法可以做到这一点，你应该手动完成；
function persist(thisArg) {
localStorage.setItem(thisArg.id, thisArg.value);
}
<input id="test" onchange="persist(this)" />
坚持并一起检索：
function persist(event) {
localStorage.setItem(event.target.id, event.target.value);
}
// you may use a more specific selector;
document.querySelectorAll("input").forEach((inputEl) => {
inputEl.value = localStorage.getItem(inputEl.id);
inputEl.addEventListener("change", persist);
});
<input id="test" />
德玛西亚99
TA贡献1770条经验 获得超3个赞
没有自动的方法可以做到这一点。你有两个选择：
通过代码示例保存数据
：
localStorage.setItem('testObject', JSON.stringify(yourObject)); // for storing data
JSON.parse(localStorage.getItem('yourObject')); // for retrieving data
代码片段：
// for saving data
function saveData(el) {
localStorage.setItem(el.id, JSON.stringify(el.value));
}
// for retrieving data on page load
function getData() {
var inp = document.getElementById("inp");
inp.value = JSON.parse(localStorage.getItem('inp')) || "";
}
<body onload="getData()">
<input id="inp" onchange="saveData(this)" />
</body>
尝试像persisto这样的辅助库
心有法竹
TA贡献1866条经验 获得超5个赞
根据已接受的答案，以下是有用的一句话：
document.querySelectorAll('input:not([type="submit"])').forEach(elt => { elt.value = localStorage.getItem(elt.name); elt.addEventListener("change", e => { localStorage.setItem(e.target.name, e.target.value); }); });<input>它将s序列化/反序列化为localStorage，并按其属性进行索引name。
- 3 回答
- 0 关注
- 143 浏览
添加回答
举报
0/150
提交
取消