How to - 체크박스가 체크되면 텍스트 표시

w3.css

체크박스가 체크되면 텍스트 표시

체크박스가 체크되면 일부 텍스트를 표시한다.

JavaScript로 체크박스가 체크되어 있는지 확인한다.

체크박스가 체크되어 있는지 확인하기

1단계) HTML 추가

Checkbox: <input type="checkbox" id="myCheck" onclick="myFunction()">

<p id="text" style="display:none">Checkbox is CHECKED!</p>

2단계) JavaScript 추가

function myFunction() {
  // Get the checkbox
  var checkBox = document.getElementById("myCheck");
  // Get the output text
  var text = document.getElementById("text");

  // If the checkbox is checked, display the output text
  if (checkBox.checked == true){
    text.style.display = "block";
  } else {
    text.style.display = "none";
  }
}

기본 예시

예제 보기