본문 바로가기
HTML

[HTML/문제해결] 라디오버튼이 여러개 선택될때 해결 방법 (라디오버튼 다중선택 방지방법)

by 메이플 🍁 2022. 3. 23.

 문제내용

일반적으로 라디오버튼은 여러 버튼 중에 하나만 선택이 가능하고, 체크박스버튼은 여러 버튼 선택이 가능하다. 라디오버튼을 만들었는데 다중선택이 된다면.

 

❗️ 해결방법

input 태그에 있는 name의 속성을 다른 input 태그와 같은것으로 사용했는지 확인해보자. 같은 라디오버튼에 속한다면 모든 input에 name의 속성값은 같아야한다. 아래 코드는 name="funding"이라는 값이 모든 input에 있다.

<form>
  <input
    type="radio"
    id="founding-date-new"
    name="founding-date"
    value="founding-date-new"
  >
  <label for="founding-date-new">신생</label>
  
  <input
    type="radio"
    id="founding-date-5years"
    name="founding-date"
    value="founding-date-5years"
  >
  <label for="founding-date-5years">5년 이상</label>
  
  <input
    type="radio"
    id="founding-date-10years"
    name="founding-date"
    value="founding-date-10years"
  >
  <label for="founding-date-10years">10년 이상</label>
</form>

댓글