반응형
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
$(document).ready(function() {
$(".submit").click(function(event) {
//선택된 개수
var count = $("select option:selected").val();
if (count == 0) {
alert("셀렉트박스를 선택해주세요.");
} else {
alert(count + "를 선택하셨습니다.");
}
//html 에서 a 태그나 submit 태그는 고유의 동작이 있다.
//페이지를 이동시킨다거나 form 안에 있는 input 등을 전송한다던가 그러한 동작이 있는데 e.preventDefault 는 그 동작을 중단시킨다
event.preventDefault();
});
});
</script>
<title>셀렉트박스 선택된 값 확인</title>
</head>
<body>
<select id="food" class="infobox">
<option value="0">Select a Food</option>
<option value="Pizza $5">Pizza $5</option>
<option value="HotDog $2">HotDog $2</option>
<option vlaue="Coke $1">coke</option>
<option value="French Fries $3">French Fries $3</option>
</select>
<input type="submit" class="submit" value="submit" />
</body>
</html>
반응형
'2020 > JQuery' 카테고리의 다른 글
| JQuery replaceWith, replaceAll, 요소 대체하기 (0) | 2020.02.28 |
|---|---|
| JQuery 속성 값 입력 (0) | 2020.02.28 |
| JQuery 객체추가 (0) | 2020.02.28 |
| JQuery 속성추가 (0) | 2020.02.28 |
| JQuery 객체이동 (0) | 2020.02.28 |
꽃꽂이하는개발자