라디오버튼, 체크박스, 셀렉트박스 값 선택하기 및 선택한 값을 가져오는 소스 입니다.
아래 예제 및 소스를 확인해 주시기 바랍니다. (결과확인 버튼 눌러보세요.)
============================================================
할인 여부: 할인
결제수단:
============================================================
<html>
<head>
<title>Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="http://code.jquery.com/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
//초기화
//라디오버튼
$("input:radio[name='book_type'][value='magazine']").prop('checked', true);
//체크박스
$("input:checkbox[name='sale_yn']").prop("checked", true);
//셀렉트박스
$("select[name='payment_type']").val("card").attr("selected", "selected");
//결과확인
$("#check").click(function(){
alert("책 종류: "+$("input:radio[name='book_type']:checked").val());
alert("할인 여부: "+$("input[name='sale_yn']").is(":checked"));
alert("결제수단: "+$("select[name='payment_type'] option:selected").val());
});
});
</script>
</head>
<body>
책 종류:
<input type="radio" name="book_type" value="novel"><span> 소설</span>
<input type="radio" name="book_type" value="magazine"><span> 잡지</span>
<input type="radio" name="book_type" value="comic"><span> 만화</span>
<br>
<br>
할인 여부:
<input type="checkbox" name="sale_yn"> 할인
<br>
<br>
결제수단:
<select name="payment_type">
<option value="cash">현금</option>
<option value="card">카드</option>
<option value="point">포인트</option>
</select>
<br>
<br>
<button id="check">결과확인</button>
</body>
</html>