localStorage come salvare una casella di controllo

Voglio salvare una casella di controllo con localstorage. In modo che quando ho controllato la scatola e chiudo il browser e lo riaprilo, verrà comunque controllato. adesso se clicco sulla casella di controllo e premo il pulsante Salva, non salva la casella di controllo.

Come posso raggiungere questo objective?

questo è il mio codice:

 function save(){ var checkbox = document.getElementById('checkbox1zaal1'); if(document.getElementById('checkbox1zaal1').checked) { localStorage.setItem('checkbox1zaal1', true); } } function load(){ var checked = localStorage.getItem('checkbox1zaal1'); if (checked == true) { document.getElementById("checkbox1zaal1").setAttribute('checked','checked'); } } function wis(){ location.reload(); localStorage.clear() }     1e film van de dag  

grazie per qualsiasi consiglio!

1). Perché il valore booleano true non è uguale alla stringa "true" . Quindi il confronto checked == true è sempre false e la casella di controllo non viene mai controllata.

Invece prova questo:

 var checked = JSON.parse(localStorage.getItem('checkbox1zaal1')); if (checked == true) { document.getElementById("checkbox1zaal1").checked = true; } 

E ricorda qualsiasi cosa tu archivi in ​​localStorage è sempre una stringa, e solo una stringa. Ecco perché quando salvi qualcosa di più complesso del valore primitivo (per esempio un certo object) assicurati di usare prima JSON.stringify .

Quando recuperi il valore da localStorage dovresti riconvertirlo al suo tipo javascript corrispondente.

In generale load funzione di load può anche essere migliorata:

 function load(){ var checked = JSON.parse(localStorage.getItem('checkbox1zaal1')); document.getElementById("checkbox1zaal1").checked = checked; } 

2). Un altro problema si presenterà quando tenti di deselezionare la casella di controllo. Al momento non lo stai gestendo, quindi modifica la funzione di save in questa:

 function save(){ var checkbox = document.getElementById('checkbox1zaal1'); localStorage.setItem('checkbox1zaal1', checkbox.checked); } 

Demo: http://jsfiddle.net/Lwxoeyyp/1/

Il problema è che stai memorizzando il valore come "true" in localStorage che è un formato stringa, Ora al momento del caricamento il valore della pagina viene recuperato come stringa e stai confrontando quella stringa “true” con boolean true. Questo restituirà false. Un piccolo cambiamento come

 if (checked == "true") 

ora dovrebbe funzionare.

Puoi anche recuperare lo stato della tua casella di controllo in questo modo:

 var selCheck = document.getElementById("checkOne"); selCheck.checked = (localStorage.getItem("34_chkOne")=="true"); 

Ovviamente,

“checkOne” è l’id della casella di controllo. “34_chkOne” è il nome della variabile di archiviazione locale.

Per memorizzare il valore, è sufficiente utilizzare

 var selCheck = document.getElementById("checkOne"); localStorage.setItem("34_chkOne", selCheck.checked); 

e, come detto sopra, verrà memorizzata una variabile di tipo string .