<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
// //input요소 중에서 name속성에 name값을 가지는 놈을 선택
// $('input[name=name]')
// .bind('focus',function(){
// // alert('포커스 얻어짐');
// $(this).css('background','pink').val('');//focus얻을때 원래 있던값 없애기 값 세팅도 똑같이 val()
// })
// .bind('blur',function(){
// // alert('이벤트 잃음');
// //배경색을 원래대로 돌려놓고, 해당 요소에 입력되있는 값을 alert으로 출력
// var value = $(this).css('background','white').val();
// alert(value);
// })
// // .mouseover(function(){
// // $(this).css('background','black');
// // });
// $('select[name=job]')
// .bind('change',function(){
// if($(this).val() != "0" ){
// alert($(this).find('option[value='+$(this).val()+']').text());
// }
// });
$('#form').submit(function() {
// alert('서밋되나?');
var idinput = $('input[name=name]');
if (idinput.val() == '') {
alert('이름이 없잖아');
idinput.focus();
return false;//submit을 막음
}
var type = $('select[name=job]').val();
if (type == "0") {
alert('직업을 고르라우!!');
return false;
} else if (type == "1") {
$(this).attr('action', '1.do');
$(this).submit();
} else if (type == "2") {
$(this).attr('action', '2.do');
$(this).submit();
} else if (type == "3") {
$(this).attr('action', '3.do');
$(this).submit();
} else if (type == "4") {
$(this).attr('action', '4.do');
$(this).submit();
} else if (type == "5") {
$(this).attr('action', '5.do');
$(this).submit();
}
});
$('input[type=checkbox].chkAll')
.bind('click',function(){
var chkAll = $('input[type=checkbox].chkAll');
if(chkAll.prop('checked'))
{
$('span.chkAll').text('선택해제');
$('div input[type=checkbox]').prop('checked',true);
}
else
{
$('span.chkAll').text('전체선택');
$('div input[type=checkbox]').prop('checked',false);
}
});
$('span.chkAll').bin('click',function(){
$('input[type=checkbox].chkAll').click();
});
});
</script>
</head>
<body>
<form id="form">
이름 : <input type="text" name="name">
직업 : <select name="job">
<option value="0">--직업선택--</option>
<option value="1">회사원</option>
<option value="2">개발자</option>
<option value="3">의사</option>
<option value="4">노가더</option>
</select>
<br>
<input type="checkbox" class="chkAll">
<span class="chkAll">전체선택</span>
<br>
<div id="subChk">
<input type="checkbox">HTML
<input type="checkbox">JavaScript
<input type="checkbox">CSS3
</div>
<br>
<input type="submit" value="제출ㅋ">
</form>
</body>
</html>
