Search code examples
javascriptjquerybrowser-cache

Browser localStorage refreshing at every page

I have coded a pop-up div which I want to display once per visit to the website per user, for which I was able to piece together as follows, but unfortunately it seems to pop-up at every single page I visit on the website:

//COOKIE POLICY POP-UP
$(document).ready(function () {

if (localStorage.getItem('pops') != 'visible') {
    setTimeout(function () {
        $('#cookie_popup').css('bottom', '0');
    }, 1000);

    $('#cookie_popup a.button').click(function () {
        $('#cookie_popup').css('bottom', '-100px');
    });

    localStorage.setItem('pops', 'visible');
}

});

window.onbeforeunload = function () {
    localStorage.removeItem('pops');
};

Edit: As pointed on the comments below, the last section window.onbeforeunload needed to be removed for it to keep the cache for the whole session.

Solution 
  •  window.onbeforeunload = function () { localStorage.removeItem('pops');};

    is removing the flag so that every time you come to the page, the flag isn't there and the popup is shown. Remove that part and make sure you manually clear localStorage yourself before each of your tests.