Guardar formulario en tiempo real

Guarda datos del formulario en tiempo real para evitar la perdida en caso se actualiza o si son formulario de varios pasos

by Luis Miguel Rodriguez Blas

HTML

<script src="https://code.jquery.com/jquery-3.2.1.slim.js"></script>
 
  <form>
<p>
<label for="campo1">
  Campo 1 
</label>
<input name="campo1" type="text">
</p>
<p>
<label for="campo2">
  Campo 2 
</label>
<input name="campo2" type="text">
</p>
<p>
<label for="campo3">
  Campo 3 
</label>
<select name="campo3">
  <option value="option1">option1</option>
  <option value="option2">option2</option>
  <option value="option3">option3</option>  
</select>
</p>
</form>

JavaScript

$(document).ready(function(){

                $('input[type="text"],select,textarea').each(function(){    
                        var name = $(this).attr('name'); 
                        value=localStorage.getItem(name);
                        var value = $(this).val(value);
                 })

                setInterval(function(){
                    $('input[type="text"],select,textarea').each(function(){    
                        var name = $(this).attr('name');
                        var value = $(this).val();
                        localStorage.setItem(name, value);
                    })
                    

                }, 1000);                 
            })