새소식
반응형
WEB/jQuery
[JQuery] 선택된 라디오 버튼만 checked 되게 설정하기
- -
반응형
2023-09-07
1. 방법
prop 를 사용해 우선 해당 클래스의 버튼들을 checked false로 만든 이후 선택된 라디오 버튼만 checked 로 만들면 된다.
<!DOCTYPE html>
<html>
<head>
<title>라디오 버튼 예제</title>
</head>
<body>
<input type="radio" class="radio_list" name="radio_group" value="Option 1" onclick="handleRadioClick(this)"> Option 1<br>
<input type="radio" class="radio_list" name="radio_group" value="Option 2" onclick="handleRadioClick(this)"> Option 2<br>
<input type="radio" class="radio_list" name="radio_group" value="Option 3" onclick="handleRadioClick(this)"> Option 3<br>
<script>
function handleRadioClick(radio) {
// 선택된 라디오 버튼만 checked 상태로 만듭니다.
$(".radio_list").prop("checked", false);
$(radio).prop("checked", true);
// 선택된 라디오 버튼의 value 값을 가져옵니다.
var selectedValue = $(radio).val();
console.log("선택된 값: " + selectedValue);
}
</script>
</body>
</html>2. JavaScript로 가져오는 방법
https://seeminglyjs.tistory.com/526
[JavaScript] 선택된 라디오 버튼만 checked로만들기
2023-09-07 1. 방법 prop 를 사용해 우선 해당 클래스의 버튼들을 checked false로 만든 이후 선택된 라디오 버튼만 checked 로 만들면 된다. Option 1 Option 2 Option 3 2. JQuery 가져오는 방법 https://seeminglyjs.tistory.
seeminglyjs.tistory.com
메인 이미지 출처 : 사진: Unsplash의David Clode
반응형
'WEB > jQuery' 카테고리의 다른 글
| [jQuery] ajax로 window.location.href = "CSV 파일 다운로드" 구현 (0) | 2023.06.06 |
|---|---|
| [jQuery] 제이쿼리를 slideToggle을 사용법 알아보기. (0) | 2021.05.01 |
| [jQuery] 제이쿼리를 이용한 href(링크) 부여 attr/location (1) | 2021.04.17 |
| [jQuery] 제이쿼리 hide / show 메소드 알아보기 (0) | 2021.04.14 |
| [jQuery] 제이쿼리 append 와 after 차이 알아보기 (0) | 2021.03.31 |
Contents
소중한 공감 감사합니다