본문 바로가기
IT 로그/HTML

[jQuery] 체크박스 라디오버튼처럼 사용하기 (체크박스 단일 선택)

by 잡다무니 2020. 6. 27.

안녕하세요. 잡다무니입니다.

 

jQuery를 사용하여 체크박스(checkbox)를 라디오 버튼(radio)처럼 사용하기입니다.

체크박스 단일 선택입니다.

 

예 / 아니오 둘 중 하나만 선택하는 동의 html을 작성해보았습니다.

 

jQuery 1.6 이후 버전에서는 prop를 사용합니다.

1.6 이전 버전에서는 attr과 prop 메서드 일관성 없이 attr로 동작을 할 수 있습니다.

동의 소스코드 캡처!!

 

HTML을 실행하면 다음 이미지처럼 예 / 아니오 체크박스를 클릭할 수 있습니다.

html 실행 캡처!!

 

jQuery API 설명을 살짝 살펴보면,

jQuery 1.6 버전 이전에는 attribute와 property를 구분하지 않아 일관성이 없는 동작을 유발할 수 있었습니다.

jQuery 1.6 버전 이후에는 attribute와 property를 메서드 동작에 따라 구분 사용하기 시작하였습니다.

(Internet Explorer 9 이전의 버전에서는 prop 동작이 되지 않을 수 있습니다. attr을 사용하셔야 될 것 같습니다.)

 

jQuery API 데모 선택 전 캡처!!

 

jQuery API 데모 선택 후 캡처!!

자세한 내용은 jQuery API를 참고 바랍니다.

 

감사합니다.

 

 

출처의 소스 코드, 이미지를 참고하여 작성하였습니다.

 

출처:

1. https://api.jquery.com/prop/

2. https://m.blog.naver.com/sixhun/220552802430

댓글