如何使用会话存储自动填写表单？
如何使用会话存储自动填写表单？
提问于 2021-10-03 16:02:31
<label for="streetname">Street Address</label>
<input type="text" id="streetname" name="streetname" required="required" placeholder="Your street name..." maxlength="40" />
function getBooking() {
if (sessionStorage.fname != undefined) {
document.getElementById("confirm_fname").textContent = sessionStorage.fname;
document.getElementById("confirm_lname").textContent = sessionStorage.lname;
document.getElementById("confirm_email").textContent = sessionStorage.email;
document.getElementById("confirm_phone").textContent = sessionStorage.phone;
document.getElementById("confirm_start").textContent = sessionStorage.start;
document.getElementById("confirm_streetname").textContent = sessionStorage.streetname;
document.getElementById("confirm_suburb").textContent = sessionStorage.suburb;
document.getElementById("confirm_state").textContent = sessionStorage.state;
document.getElementById("confirm_postcode").textContent = sessionStorage.postcode;
document.getElementById("confirm_skill").textContent = sessionStorage.skill;
document.getElementById("confirm_other").textContent = sessionStorage.other;
document.getElementById("confirm_otherbox").textContent = sessionStorage.otherbox;
document.getElementById("a_fname").value = sessionStorage.fname;
document.getElementById("a_lname").value = sessionStorage.lname;
document.getElementById("a_email").value = sessionStorage.email;
document.getElementById("a_phone").value = sessionStorage.phone;
document.getElementById("a_start").value = sessionStorage.start;
document.getElementById("a_streetname").value = sessionStorage.streetname;
document.getElementById("a_suburb").value = sessionStorage.suburb;
document.getElementById("a_state").value = sessionStorage.state;
document.getElementById("a_postcode").value = sessionStorage.postcode;
document.getElementById("a_skill").value = sessionStorage.skill;
document.getElementById("a_other").value = sessionStorage.other;
document.getElementById("a_otherbox").value = sessionStorage.otherbox;
}
}
如果用户已经在同一浏览器会话中填写了表单，那么如何使用外部JavaScript文件使用会话存储来自动填充表单？如果表单被正确验证，我已经有了将值存储在会话存储中的代码，那么我将如何处理呢？
如果需要更多或更少的信息，请告诉我。
注:请勿使用jQuery或内联Javascript。
回答 2
Stack Overflow用户
回答已采纳
发布于 2021-10-03 16:54:06
sessionStorage和localStorage都有用于检索数据的getItem函数和存储数据的setItem函数。
还有其他一些有用的功能。
所以，在这种情况下，你似乎需要：
document.getElementById("a_fname").value = sessionStorage.getItem("fname");其他人也一样。
有关更多信息，请查看这。
Stack Overflow用户
发布于 2021-10-03 21:14:38
您需要寻找localStorage方法: getItem(key)、setItem(key，value)。有点晚但有一件事我注意到了。也许这对你的例子还是有帮助的。如果有这么多的元素，我会通过一个循环来完成。例如：
<div id="confirm_fname">First Name</div>
<div id="confirm_lname">Last Name</div>
<div id="confirm_email">Email</div>
...
<script>
const keyNames = [
{k1: 'confirm_fname', k2: 'fname'},
{k1: 'confirm_lname', k2: 'lname'},
{k1: 'confirm_email', k2: 'email'}
]
keyNames.map(function (key) {
sessionStorage.setItem(key.k2, Math.random()); // set to localStorage
document.getElementById(key.k1).textContent = sessionStorage.getItem(key.k2); // get from localStorage
})
</script>它使代码更短，您可以轻松地对元素进行汉德尔。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/69426533
复制相关文章
相似问题
腾讯云开发者
