How to get data from form to javascript and redire

2019-08-15 18:17发布

问题:

I have a html5 form with name, surname ect. The reason why I'm using a form is so that the user has to fill in everything, for that I'm using required. I want to save all the data in localStorage, for that I need to move the data to JavaScript.

How do access the data in JavaScript when the submit button is pressed while redirecting the user to another page?

This is the code:

Html5

<form id="TheForm" method="post">
   <input type="text" id="Name" placeholder="*Förnamn" required >
   <input type="text" id="Surname" placeholder="*Efternamn" required >
   <input type="email" id="FirstEmail" placeholder="*e-postadress" autocomplete="on" required >
   <input type="email" id="SecondEmail" placeholder="*Verifiera e-postadress" autocomplete="off" required >
   <input type="text" id="Address" placeholder="*Adress" required >
   <input type="submit" id="Submit" onclick="function()" value="Skicka">
</form> 

回答1:

var submit = function () {
    window.localStorage.name = document.getElementById('Name').value;

    // Save all the other fields
    // You either return a non-false value here and let the form submit
    // Or you return false and do a window.location change 
};

window.onload = function () {
    var form = document.getElementById('TheForm');

    if (form.attachEvent) {
        form.attachEvent('submit', submit);
    } else {
        form.addEventListener('submit', submit);
    }
}


回答2:

Try this

Java Script

function storeDetails() {
    if(typeof(Storage)!=="undefined") {
       localStorage.setItem('name', document.getElementById('Name').value));                              
       //code to store other values will go here
    } else {
        alert('Your browser do not support local storage');
    }
}

HTML

<form id="TheForm" method="post" onsubmit="javascript:storeDetails();" action=" ">
   <input type="text" id="Name" placeholder="*Förnamn" required >
   <input type="text" id="Surname" placeholder="*Efternamn" required >
   <input type="email" id="FirstEmail" placeholder="*e-postadress" autocomplete="on" required >
   <input type="email" id="SecondEmail" placeholder="*Verifiera e-postadress" autocomplete="off" required >
   <input type="text" id="Address" placeholder="*Adress" required >
   <input type="submit" id="Submit" onclick="function()" value="Skicka">
</form>