尝试将表单数据抓取到 JavaScript 中。我不确定为什么这不起作用。
<!DOCTYPE html>
<html>
<body>
<form action="site2.html" onsubmit="store()">
Enter your name: <input type="text" name="name" />
Enter your age: <input type="text" name="age" />
<input type="submit" />
</form>
<!-- <div id="result"></div> -->
<script>
function store() {
// Check browser support
if (typeof(Storage) !== "undefined") {
var s = document.getElementById("name").value;
localStorage.setItem("lastname", s);
}
}
</script>
</body>
</html>
最佳答案
它在此代码段中不起作用，因为 localStorage 在沙盒区域中被阻止。代码仅供引用。您可以在 this jsFiddle 中看到它正在运行。 。如果您提交表单并刷新/重新运行页面，您会发现它甚至还设置了 localStorage 中的输入值。此外，这适用于表单中存在的任何字段。添加更多输入以查看其工作情况。 (确保您给他们起了一个名字)
工作 jsFiddle(假设您的浏览器支持 localStorage):
https://jsfiddle.net/jcgodLt6/1/
SO 片段(此处供引用):
var form = document.getElementById("myform");
form.addEventListener("submit", store, false);
function store(e){
e.preventDefault();//prevent submission
var inputs = form.elements;
for (let i = 0; i < inputs.length; i++) {
localStorage.setItem(inputs[i].name, inputs[i].value);
console.log(inputs[i].name, inputs[i].value);
}
}
function retrieve(){
var inputs = form.elements;
for (let i = 0; i < inputs.length; i++) {
inputs[i].value = localStorage.getItem(inputs[i].name);
console.log(inputs[i].value);
}
}
retrieve(); <form action="site2.html" onsubmit="store()">
Enter your name: <input type="text" name="name" />
Enter your age: <input type="text" name="age" />
Fave thing: <select name="fave"><option>Bees</option><option>Jam</option></select>
<input type="submit" value="submit" />
</form>关于javascript - 将 HTML 表单输入发送到 Javascript 函数以进行本地存储，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/58582556/