[Javascript] Ricordare il click con i cookies

trattorino

Utente Attivo
23 Lug 2016
174
1
18
38
Salve a tutti, allora io ho creato un blocco div che ogni volta che viene cliccato questo si chiude, inserendo il block none dei css, uso jquery , questo codice
HTML:
$('.ChiusuraBlock').click(function(){
$('.hide-blockC').slideToggle()
});
clicco e lo chiude, ora la domanda è questa, come posso far in modo che a ogni refresh possa salvare l'ultima azione che un utente ha cliccato, se clicco e si chiudo, vorrei che se visito la pagina trovo il blocco già chiuso, spero di essermi spiegato bene, grazie in anticipo, a presto
 

otto9due

Utente Attivo
22 Feb 2014
529
21
28
Prova ad utilizzare lo Storage html5 dovrebbe funzionare


Saluti G.G.
 

otto9due

Utente Attivo
22 Feb 2014
529
21
28
Al momento sono dal cell ma puoi dare un'occhiata qui, si capisce molto bene il suo utilizzo. Funziona un pó come i cookies, puó essere o di sessione o di perenne. Sfrutta 5mb di memoria sul pc dell'utente per memorizzare dati. L'utilizzo è veramente semplice.
https://www.w3schools.com/html/html5_webstorage.asp


Saluti G.G.
 
  • Like
Reactions: trattorino

trattorino

Utente Attivo
23 Lug 2016
174
1
18
38
non ci riesco... non puoi darmi uno spunto tu con il codice che ho inserito?
 

otto9due

Utente Attivo
22 Feb 2014
529
21
28
Perdonami il ritardo nella risposta ma ho avuto qualche problemino in questi giorni..
Ti ho preparato un esempio dimostrativo, è chiaro che poi va sviluppato per quello che ti serve..
Codice:
<!DOCTYPE html>
<html>
<head>
<title>Pagina di prova</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
   // Salvo nello storage (qui puoi salvare quello che ti pare come fosse una variabile)
   // Quando ricaricherai la pagina puoi riprendere quel dato salvato
localStorage.nome = "Prova Nome";
   // Esempio di lettura dallo storage
$( "div.demo" ).html(localStorage.nome);

    // Stessa cosa con le sessioni, in questo caso si registrano così però
    // Puoi prevedere anche una funzione che conta i click
    sessionStorage.clickcount = "quello che ti pare";
    $( "div.demo1" ).html(sessionStorage.clickcount);
});

</script>
</head>
<body>
  <div class="demo"></div>
  <div class="demo1"></div>
</body>
</html>
 
  • Like
Reactions: trattorino

trattorino

Utente Attivo
23 Lug 2016
174
1
18
38
Cosa ci va sul testo prova nome, se provo a far girare questo codice, poi mi scompare il contenuto dentro il div, io usa semplicemente questo

HTML:
$('.ChiusuraBlock').click(function(){
$('.hide-blockC').slideToggle()
});

 <div class="ChiusuraBlock"></div>
mi apre e chiude il blocco
 

otto9due

Utente Attivo
22 Feb 2014
529
21
28
Dovresti fare un if. Per esempio, fare in modo di dare un valore 0 o 1 al dato che salvi nello Storage. Quando l'utente apre la pagina, in base all'ultimo valore salvato nello Storage, aggiungi o togli il display:none; o comunque fai in modo che hide-blockC appaia in base al valore salvato in storage. Se il valore fosse 1 ad esempio aperto, al contrario se è 0 parte chiuso.
Ora sono da cell non riesco a mandarti nulla, lunedì se ancora non hai risolto vedo di mandarti qualcosa.


Saluti G.G.
 

otto9due

Utente Attivo
22 Feb 2014
529
21
28
Se ho capito bene cosa ti serve, anche se la soluzione non è particolarmente elegante, prova con questi aggiustamenti.
Codice:
<!DOCTYPE html>
<html>
<head>
<title>Pagina di prova</title>
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script>
$( document ).ready(function() {
    // Verifico l'ultimo stato memorizzato e lo imposto
    var stato = localStorage.status;
        if (stato == 1) {
            $(".demo").css("display", "initial");
        } else {
            $(".demo").css("display", "none");
        }
    // Al click Cambio e salvo lo stato nello storage
        $("button.but").click(function () {
            $(".demo").toggle();
            if (stato == 1) {
                localStorage.status = 0;
            } else {
                localStorage.status = 1;
            }
        });
    });
</script>
</head>
<body>
  <button class="but">Apri</button>
  <div class="demo" style="display: none;">Prova di div da far scomparire e ricomparire, ricordando l'ultima mossa</div>
</body>
</html>
Ho dato per scontato che all'inizio ( prima di ogni click dell'utente ) il testo deve essere nascosto.. In caso contrario basterà togliere il style="display: none;" dal div.