<예제>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html;" charset="utf-8" >
<title> 폼 요소의 값 가져오기 및 설정</title>
<script src="http://code.jquery.com/jquery-1.7.2.js"></script>
<script>
$(document).ready(function (){
//초기값
$('#txtName').val("google");
$('input:radio').val(['f']);
$('#lst').val(['0','2']);
$('#btnok').click(function(){
var msg = "";
//반드시 폼요소의 value속성을 가져온다 <> 에러
msg += $('#txtName').val() + '\n';
//라디오버튼의 체크된 value속성을 가져옴<>undefined
msg += $('input:radio[name=gen]:checked').val() + '\n';
//리스트박스에서 여러개 값 가져오기
msg += $('#lst').val().join("|") + '\n';
alert(msg);
});
});
</script>
</head>
<body>
텍스트박스 : <input type="text" id="txtName" /><br />
라디오버튼 :
<input type="radio" id="gen1" name="gen" value="m" />남
<input type="radio" id="gen2" name="gen" value="f" />여
드롭다운리스트
<select id="lst" multiple="multiple" size="3">
<option value="0">자바스크립트</option>
<option value="1">제이쿼리</option>
<option value="2">프로토타입</option>
</select>
<input type="button" value="확인" id="btnok" />
</body>
</html>
'강좌 > jQuery' 카테고리의 다른 글
제이쿼리(jQuery) Manipulation API (0) | 2013.04.23 |
---|---|
제이쿼리(jQuery) Traversing (0) | 2013.04.23 |
jQuery Attributes(jQuery로 요소의 속성 변경하기, 맵 이용) - 3 (0) | 2013.04.22 |
jQuery Attributes(jQuery로 요소의 속성 변경하기) - 2 (0) | 2013.04.22 |
jQuery Attributes(jQuery로 요소의 속성 변경하기) - 1 (0) | 2013.04.22 |