js 使用 sessionStorage 实现两个页面相互跳转且不丢失之前网页填写的信息
Posted 霜序0.2℃
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了js 使用 sessionStorage 实现两个页面相互跳转且不丢失之前网页填写的信息相关的知识，希望对你有一定的参考价值。
使用了sessionStorage技术,类比cookie和localStorage:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>注册</title>
</head>
<body>
<form method="post">
<label for="msg">请输入姓名:</label><input type="text" id="msg">
<input type="button" id="btn" value="下一页" onclick="next()">
</form>
<script>
window.onload = function () {
let msg = sessionStorage.getItem("msg");
let toMsg = document.getElementById("msg");
toMsg.value = msg;
}
function next() {
let msg = document.getElementById("msg");
sessionStorage.setItem("msg", msg.value);
window.location.href = "register2.html";
}
</script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>注册2</title>
</head>
<body>
<form method="post">
<label for="msg2">请输入性别:</label><input type="text" id="msg2">
<input type="button" id="btn" value="下一页" onclick="last()">
</form>
<script>
window.onload = function () {
let msg2 = sessionStorage.getItem("msg2");
let toMsg = document.getElementById("msg2");
toMsg.value = msg2;
}
function last() {
let msg2 = document.getElementById("msg2");
sessionStorage.setItem("msg2", msg2.value);
window.location.href = "register.html";
}
</script>
</body>
</html>
以上是关于js 使用 sessionStorage 实现两个页面相互跳转且不丢失之前网页填写的信息的主要内容，如果未能解决你的问题，请参考以下文章
JS 详解 Cookie LocalStorage 与 SessionStorage
localStorage使用总结 JS 详解 Cookie LocalStorage 与 SessionStorage
js loaclstorage和sessionstorage
JS惰性删除和定时删除可过期的localStorage缓存，或sessionStorage缓存