How do i set a value per session in jQuery?

Question

I am generating a random number in jquery and I want this value not to change per session. It means, the value should not renew every time the page is refreshed.

<p class="remaining-memberships"><span>XX</span>/p>

This is my current code:

  var minMember = 10;
  var maxMember = 50;

  var randomNumber = randomNumberFromRange(minMember, maxMember);

  function randomNumberFromRange(min,max)
  {
      return Math.floor(Math.random()*(max-min+1)+min);
  }

  var yetVisited = localStorage['visited'];
  var setRandomMember = randomNumber;

  if (!yetVisited) {
    // open popup
    localStorage['visited'] = "yes";
    $('.remaining-memberships span').html(randomNumber);
  }
  else {
  }

How do I set my if else code properly so that the value inside $('.remaining-memberships span') will only change if the page is not yet visited and if it is already visited, the value must retain.

Any help is appreciated. Thanks

Answer 1

Attempt to get the value/object from local storage, if it is empty then run your function and then store in localStorage.

I've changed it to store as JSON which can be parsed upon retrieval as it will allow you to store a visit object with your randomNumber and visited values (not sure if you wanted the later).

<script>
  var visit = localStorage.getItem("visit");

  // new visit
  if (!visit) {
    var minMember = 10;
    var maxMember = 50;

    function randomNumberFromRange(min, max) {
      return Math.floor(Math.random() * (max - min + 1) + min);
    }

    var randomNumber = randomNumberFromRange(minMember, maxMember);

    visit = {
      visited: 'yes',
      randomNumber: randomNumber
    };

    localStorage.setItem('visit', JSON.stringify(visit));
  } else {
    visit = JSON.parse(visit)
  }

  $('.remaining-memberships span').text(visit.randomNumber);

</script>

Untested but should work.

Answer 2

You can just store the random in localStorage like so:

  var minMember = 10;
  var maxMember = 50;

  var randomNumber = randomNumberFromRange(minMember, maxMember);
  localStorage['myRandom'] = randomNumber;

Answer 3

Why not just store the random number in your localStorage with the visited flag?

var minMember = 10;
var maxMember = 50;

var randomNumber = randomNumberFromRange(minMember, maxMember);
function randomNumberFromRange(min,max)
{
  return Math.floor(Math.random()*(max-min+1)+min);
}

var yetVisited = localStorage['visited'];
var setRandomMember = randomNumber;

if (!yetVisited) {
   // open popup
   localStorage['visited'] = "yes";
   localStorage['randomNumber'] = randomNumber;
   $('.remaining-memberships span').html(randomNumber);
}
else {
   $('.remaining-memberships span').html(localStorage['randomNumber']);
}