Как переключить видимость блока при изменении состояния чекбокса?

Question

[Andrej Sharapov]

Что не так в скрипте и можно ли его сделать проще?
Песочница: https://jsfiddle.net/gdxtj19v/2/
Задача: нужно, чтобы при активном чеке блок становился видимым и при повторном клике снова прятался.

Answer 1

[0xD34F]

что не так в скрипте

А что, думаете функция сама себя должна привязать к чекбоксу в качестве обработчика события change? Нет, так не будет - это ваша работа.

можно ли его сделать проще

Можно:

document.querySelector('#play').addEventListener('change', e => {
  document.querySelector('.block').style.opacity = +e.target.checked;
});

Или, вообще без js:

#play:checked ~ div > .block {
  opacity: 1;
}

Comments

[Andrej Sharapov]

Егор Скороходов, да он все правильно сказал. Я пока в процессе изучения js, решаю по мере возникновения задач. Вроде скрипт составил, а обработчик забыл) А вам спасибо за решение.