Как получить значения из моей формы для последующего использования?

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>

Как я go могу получить эту информацию и отобразить ее пользователю на другой странице как событие?

Answer 1

А как насчет использования 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>
   document.getElementById('input1').value = localStorage.getItem("EventName");
   document.getElementById('input2').value = localStorage.getItem("EventDateAndTime");
   document.getElementById('input3').value = localStorage.getItem("EventLocation");
   document.getElementById('input4').value = localStorage.getItem("EventNotes");
</script>

<script>
   function myFunction() {
      localStorage.setItem("EventName", document.getElementById('input1').value);
      localStorage.setItem("EventDateAndTime", document.getElementById('input2').value);
      localStorage.setItem("EventLocation", document.getElementById('input3').value);
      localStorage.setItem("EventNotes", document.getElementById('input4').value);
   }
</script>

А вот живое демо: https://codepen.io/marchmello/pen/eYpdmQb

Answer 2

используйте submit с атрибутом action, равным 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...