JSFiddle - React, Tailwind, and code Playground

HTML

<p> onbeforeUnload wont work well in js fiddle. they probably clear the local storage or something </p>
<p> use the buttons instead </p>

<button id="save"> save vals  </button>
<button id="clear"> clear vals </button>
<button id="restore"> restore vals </button>


name:<input type="text" id="name">
comment:<input type="text" id="comment">

JavaScript

var userdID = '123';


$('#clear').click(function(){
  $("input[type='text']").val('');
});

$('#save').click(function(){
var  inputVals = []; 
    $("input[type='text']").each(function(){
        inputVals.push({ id : this.id, val: this.value });
    });
debugger;    
    localStorage.setItem( userdID.concat('_inputVals'), JSON.stringify(inputVals) );
});


$('#restore').click(function(){
debugger;  
    var  inputVals = JSON.parse(localStorage[userdID.concat('_inputVals')]);

    $(inputVals).each(function(){
     $("#"+this.id).val(this.val);
    
    });
   
});