Checkbox im Browser speichern

  • Hallo liebe Community,


    hiermit bitte ich höflich um Hilfestellung. Ich muss den Zustand einer Checkbox im Browser speichern. Ich denke, das lässt sich bestimmt mit JavaScript umsetzen. Leider finde ich im WWW keine für mich verständliche Lösung. Könnt ihr mir eventuell einen Impuls geben?


    Gruß aus´m Keller

    • Official Post

    So in etwa?

    Alexander Ebert
    Senior Developer WoltLab® GmbH

  • Und wie würde der Code aussehen wenn man statt der Checkbox lieber optisch was schöneres möchte wie zB. mit Icon ähnlich der Themen erledigt Funktion?

  • <input type="checkbox" id="foobar"> <script> (() => { const checkbox = document.getElementById("foobar"); const wasChecked = window.localStorage.getItem("myFoobarKey"); if (wasChecked === "1") { checkbox.checked = true; } else if (wasChecked === "0") { checkbox.checked = false; } checkbox.addEventListener("change", () => { window.localStorage.setItem("myFoobarKey", checkbox.checked ? "1" : "0"); }); })(); </script>

    Besten Dank. Das funzt so, wie ich mir das vorgestellt habe. Aber leider erscheinen zwei Checkboxen. Perfekt wäre es, wenn ich die Möglichkeit hätte, zwei Formatierungen zu implementieren. Beispiel: Checkbox ohne Häkchen rot, Checkbox mit Häkchen grün.


    Hier der aktuelle Code

    ps: wenn ich die Checkbox mehrfach auf einer Seite platzieren möchte, einzeln, ohne das der Zustand einer Kontrollbox auf alle angewandt wird, was muss ich bei der Konfiguration des Snippet beachten?