[Javascript] 체크박스 체크여부 확인하기

 

체크박스는 2개의 상태를 가집니다.

• checked
• unchecked

이번 포스팅에서는

체크박스의 상태를 확인하는 예제를 정리해보았습니다.

 

 

체크박스의 체크여부 확인하기

 

<label>
  <input type='checkbox'
         id='my_checkbox'
         onclick='is_checked()'
  > 체크하세요
</label>

<pre id='result'>
</pre>

function is_checked() {
  
  // 1. checkbox element를 찾습니다.
  const checkbox = document.getElementById('my_checkbox');

  // 2. checked 속성을 체크합니다.
  const is_checked = checkbox.checked;

  // 3. 결과를 출력합니다.
  document.getElementById('result').innerText = is_checked;
  
}

 

checkbox가 선택되었는지 확인하기 위해서

1. checkbox element를 선택하고,
2. checkbox의 checked 속성을 확인하였습니다.

 

checkbox element의 checked 속성은 boolean 값을 가집니다.

체크박스가 선택되면 true, 체크박스가 선택 해제되면 false 값을 가집니다.

 

 

---

체크박스의 선택여부를 확인하는 방법을 알아보았습니다.