如何从表单中检索值以供以后使用？

Question

我使用 Javascript 和 html 创建了一个表单，它看起来像这样：

function testResults (form) {

    var TestVar = form.inputbox.value;

    var formData = $('#vibhu').serialize();

    formData = JSON.stringify(formData);

    if (window.localStorage) {

    localStorage.setItem('formData', formData);

<h1 class="title">Create Event</h1>

<FORM NAME="myform" ACTION="" METHOD="GET"><BR>

Event Name: <INPUT TYPE="text" NAME="name" VALUE=""><P>

Date and Time: <INPUT TYPE="datetime-local" NAME="date" Value=""><P>

Event Location: <INPUT TYPE="text" NAME="location" VALUE=""><P>

Event Notes<INPUT TYPE="text" NAME="notes" VALUE=""><P>

我试图在另一个网页上使用

<script language="JavaScript">

    document.getElementById("result").innerHTML = 

localStorage.getItem("myForm");

}

</script>

如何才能检索此信息并将其作为事件在另一个页面上显示给用户？

Answer 1

像这样使用submitwithaction属性form<form name="myform" action="./html2.html" method="GET">Event Name: <input type="text" name="name" value=""/>Event Date and Time: <input type="datetime-local" name="date" value=""/>Event Location: <input type="text" name="location" value=""/>Event Notes: <input type="text" name="notes" value=""/><input value="submit" type="submit"/></form>当你点击提交按钮时，页面同时跳转到html2.html?name=xxx&date=xxx&location=xxx...

Answer 2

使用 localStorage 怎么样？要存储项目，请使用localStorage.setItem("valuename", "data");.要获得项目的价值，请使用localStorage.getItem("valuename");.这是一个例子：<FORM NAME="myform" ACTION="" METHOD="GET"><BR>Event Name: <INPUT TYPE="text" NAME="name" VALUE="" id="input1"><P>Event Date and Time: <INPUT TYPE="datetime-local" NAME="date" Value="" id="input2"><P>Event Location: <INPUT TYPE="text" NAME="location" VALUE="" id="input3"><P>Event Notes: <INPUT TYPE="text" NAME="notes" VALUE="" id="input4"><P><button onclick="myFunction()" type=submit>Submit</button></form><script>&nbsp; &nbsp;document.getElementById('input1').value = localStorage.getItem("EventName");&nbsp; &nbsp;document.getElementById('input2').value = localStorage.getItem("EventDateAndTime");&nbsp; &nbsp;document.getElementById('input3').value = localStorage.getItem("EventLocation");&nbsp; &nbsp;document.getElementById('input4').value = localStorage.getItem("EventNotes");</script><script>&nbsp; &nbsp;function myFunction() {&nbsp; &nbsp; &nbsp; localStorage.setItem("EventName", document.getElementById('input1').value);&nbsp; &nbsp; &nbsp; localStorage.setItem("EventDateAndTime", document.getElementById('input2').value);&nbsp; &nbsp; &nbsp; localStorage.setItem("EventLocation", document.getElementById('input3').value);&nbsp; &nbsp; &nbsp; localStorage.setItem("EventNotes", document.getElementById('input4').value);&nbsp; &nbsp;}</script>这是一个现场演示：https ://codepen.io/marchmello/pen/eYpdmQb