自动将所有输入值保存到 localStorage 并在页面重新加载时恢复它们
我即将在 Javascript 中编写一些代码（涉及每个代码的循环<input>并添加侦听器）：
允许在按键后将所有
<input>值保存到localStorage恢复页面/浏览器已关闭并在同一页面上重新打开的情况下的所有
<input>值localStorage
但也许浏览器提供了一种自动方式？
例如，通过添加一个属性<input>，类似于<input autofocus>（此处不相关）
问：HTML标签有自动保存功能吗<form> <input>？
HUX布斯浏览 137回答 3
3回答
-
撒科打诨
据我所知，没有内置的方法可以做到这一点，你应该手动完成；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
没有自动的方法可以做到这一点。你有两个选择：通过代码示例保存数据：localStorage.setItem('testObject', JSON.stringify(yourObject)); // for storing dataJSON.parse(localStorage.getItem('yourObject')); // for retrieving data代码片段：// for saving datafunction saveData(el) { localStorage.setItem(el.id, JSON.stringify(el.value));}// for retrieving data on page loadfunction getData() { var inp = document.getElementById("inp"); inp.value = JSON.parse(localStorage.getItem('inp')) || "";}<body onload="getData()"> <input id="inp" onchange="saveData(this)" /></body>尝试像persisto这样的辅助库 -
心有法竹
根据已接受的答案，以下是有用的一句话：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。
随时随地看视频慕课网APP
相关分类
Html5