728x90
반응형
반응형
Radio 버튼 체크 여부 확인하는 예제
728x90
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<script>
$(document).ready(function() {
$(document).ready(function() {
$('#checkRadio').click(function() {
// 선택된 라디오 버튼 확인
const selected = $('input[name="gender"]:checked').val(); // 선택된 값 가져오기
if (selected) {
alert(`선택된 값: ${selected}`);
} else {
alert('라디오 버튼이 선택되지 않았습니다.');
}
});
});
});
</script>
</head>
<body>
<form>
<input type="radio" name="gender" value="Male" id="male" checked> Male
<input type="radio" name="gender" value="Female" id="female"> Female
<button type="button" id="checkRadio">Check Radio</button>
</form>
</body>
</html>- 설명 :
- $('input[name="gender"]:checked'): name="gender"인 라디오 버튼 중에서 체크된 요소를 선택.
- .val(): 선택된 요소의 값을 가져옴.
- 만약 선택된 요소가 없다면, .val()은 undefined를 반환.
관련글
728x90
반응형
'프로그래밍 > jQuery' 카테고리의 다른 글
| [jquery] DOM 요소 대체 메서드 (replaceAll) (89) | 2024.12.18 |
|---|---|
| [jquery] 필터링 메서드 .first() .last() .eq() .not() (73) | 2024.12.17 |
| [jquery] 제이쿼리를 사용하여 class로 값 가져오기 (44) | 2024.12.09 |
| [jquery] 제이쿼리를 사용하여 name으로 값 가져오기 (125) | 2024.12.09 |
| [jquery] 제이쿼리를 사용하여 id 값 가져오기 (71) | 2024.12.08 |