Store "do not show again" with localStorage

1

I have a div that can be hidden when you click a button:

$(".fechar").click(function(){
    $("#mensagem").hide();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><divid="mensagem">
  <p>(...)</p>
  <button class="fechar">Fechar e não mostrar novamente</button>
</div>

What I need is for it to no longer appear after being hidden for the first time.

I found a form with Jquery dialog , but it does not allow me to customize it right away, at least not in a simple way, so I need it and I prefer it to be like this.

How do I memorize this action in the localStorage?

    
asked by anonymous 08.11.2018 / 16:15

1 answer

0

Simple, first you need to capture in your click event that div was clicked, could be something like:

$(".fechar").click(function(){
    $("#mensagem").hide();
    //definindo que foi clicado
    window.localStorage.setItem('clicado', 'clicado');
});

And on your document.ready() , make sure clicado is set, if it is, hide div :

$(document).ready(function(){ 
   if(window.localStorage.getItem('clicado')) {
        $("#mensagem").hide(); 
   } 
});

Your final code:

$(".fechar").click(function(){
    $("#mensagem").hide();
    window.localStorage.setItem('clicado', 'clicado');
});

$(document).ready(function(){ 
   if(window.localStorage.getItem('clicado')) {
        $("#mensagem").hide(); 
        console.log('clicado definido')
   } 
});

See working in Jsfiddle: link

    
08.11.2018 / 16:24