Как установить состояние флажка в локальном хранилище после запуска события - PullRequest
Новая
       7

Как установить состояние флажка в локальном хранилище после запуска события

0 голосов
/ 06 января 2019

У меня есть флажок ввода, который отмечен по умолчанию, который переключает видимость элемента на странице. Я хочу, чтобы параметры пользователей сохранялись при обновлении страницы. 

var c = document.createElement('input')
c.setAttribute("type", "checkbox")
c.checked = true

c.onclick = function(){
    if(c.checked) element.style.display = 'block'
    if(c.checked == false) element.style.display = 'none'
}

/* This code below saves the state of the checkbox,
 but never fires the event or updates the element */

c.checked = (localStorage.getItem('cchecked')== 'true');
c.onchange = function(){
    localStorage.setItem('cchecked', c.checked)
}

1 Ответ

0 голосов
/ 06 января 2019

Ну, более полный пример работает .. 

<!DOCTYPE html>
<html>
    <body>
        <hr id="line" />

        <script>
        var element = document.getElementById('line')
        var c = document.createElement('input')
        c.setAttribute("type", "checkbox")
        c.checked = true

        c.onclick = function(){
            if(c.checked) element.style.display = 'block'
            if(c.checked == false) element.style.display = 'none'
        }

        /* This code below saves the state of the checkbox,
         but never fires the event or updates the element */

        // c.checked = (localStorage.getItem('cchecked')== 'true');
        if (localStorage.getItem('cchecked')== 'true') {
            c.checked = true;

        }
        else if (localStorage.getItem('cchecked')== 'false') {
            c.checked = false;

        }

        c.onchange = function(){
            localStorage.setItem('cchecked', ( c.checked ? 'true' : 'false'))
        }

        if ( !c.checked) element.style.display = 'none'

        document.body.appendChild(c);
        </script>

    </body>

</html>
...