[Javascript] Ricordare il click con i cookies

trattorino · 26 Nov 2017

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 · 26 Nov 2017

Prova ad utilizzare lo Storage html5 dovrebbe funzionare

Saluti G.G.

trattorino · 26 Nov 2017

non so da dove partire pultroppo

otto9due · 26 Nov 2017

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.

trattorino · 27 Nov 2017

non ci riesco... non puoi darmi uno spunto tu con il codice che ho inserito?

otto9due · 1 Dic 2017

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>

trattorino · 1 Dic 2017

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 · 2 Dic 2017

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 · 5 Dic 2017

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.

Cerca

Cerca

[Javascript] Ricordare il click con i cookies

trattorino

Utente Attivo

otto9due

Utente Attivo

trattorino

Utente Attivo

otto9due

Utente Attivo

trattorino

Utente Attivo

otto9due

Utente Attivo

trattorino

Utente Attivo

otto9due

Utente Attivo

otto9due

Utente Attivo

Discussioni simili