Local Storage on page refresh returns empty value

Question

Local storage returns an empty string after page refresh on woocomerce not sure why code below returns an empty value when there should be the value stored inside:

$(document).ready(function() {
  $(window).keyup(saveSettings);
  if (window.localStorage) {
    loadSettings();
  }
});

function loadSettings() {
  $('#billing_first_name').val(localStorage.bfn);
  $('#billing_last_name').val(localStorage.bln);
  $('#billing_company').val(localStorage.cn);
  $('#billing_phone').val(localStorage.phone);
  $('#billing_email').val(localStorage.ea);
}

function saveSettings() {
  localStorage.bfn = $('#billing_first_name').val();
  localStorage.bln = $('#billing_last_name').val();
  localStorage.cn = $('#billing_company').val();
  localStorage.phone = $('#billing_phone').val();
  localStorage.ea = $('#billing_email').val();

}

Anytips are helpful thanks in advance.

Answer 1

You're using it wrong, this is how you set and retreive items:

localStorage.setItem('name', 'value');
var value = localStorage.getItem('name');
console.log(value); //value

So in your case, eg:

localStorage.setItem('bfn', $('#billing_first_name').val()); //Set value
$('#billing_first_name').val(localStorage.getItem('bfn')); //Get value