jquery를 이용해서 시작날짜가 종료날짜 보다 작으면 경고창을 띄워준다.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>시작날짜와 종료날짜 비교</title>
<script type="text/javascript" src="./js/jquery-1.12.4.min.js"></script>
<script type="text/javascript">
$(function(){
$("#mform").submit(function(){
var startDate = $('#startDate').val();
var endDate = $('#endDate').val();
//-을 구분자로 연,월,일로 잘라내어 배열로 반환
var startArray = startDate.split('-');
var endArray = endDate.split('-');
//배열에 담겨있는 연,월,일을 사용해서 Date 객체 생성
var start_date = new Date(startArray[0], startArray[1], startArray[2]);
var end_date = new Date(endArray[0], endArray[1], endArray[2]);
//날짜를 숫자형태의 날짜 정보로 변환하여 비교한다.
if(start_date.getTime() > end_date.getTime()) {
alert("종료날짜보다 시작날짜가 작아야합니다.");
return false;
}
});
});
</script>
</head>
<body>
<form action="event.jsp" id="mform">
이벤트 시작일<input type="date" name="startDate" id="startDate">
이벤트 종료일<input type="date" name="endDate" id="endDate">
<input type="submit" value="전송">
</form>
</body>
</html>
'javaScript&jQuery' 카테고리의 다른 글
jQuery로 구현한 checkobx 전체 선택/해제 하기 (0) | 2016.07.21 |
---|---|
jquery를 이용한 radio button 정보 얻기 (0) | 2016.07.21 |
checkbox, radio 에서 정보 읽어 올 때 주의사항 (0) | 2016.07.20 |
자바스크립트 - json2.js 파일을 이용한 json 객체 생성 (0) | 2016.07.20 |
자바스크립트 - json 형식의 텍스트 데이터를 객체로 생성하기 (0) | 2016.07.20 |