[JQuery] 선택된 라디오 버튼만 checked 되게 설정하기

2023-09-07


사진: Unsplash 의 David Clode


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


메인 이미지 출처 : 사진: UnsplashDavid Clode