jquery datepicker 달력

공부/Jquery

jquery datepicker 달력

성난호랑이 시니철 2015. 12. 30. 15:57

jquery datepicker 달력 입니다.

<!DOCTYPE html>

<head>
	<meta charset="UTF-8">
	<script type="text/javascript" src="./js/jquery-1.11.3.min.js"></script>
	<script type="text/javascript" src="./js/jquery-ui.js"></script>
	<link rel="stylesheet"type="text/css"  href="./js/jquery-ui.css">
<script>
	$(function() {
	  $( "#datepicker" ).datepicker({
	    dateFormat: 'yy-mm-dd',        // 원하는 방식으로 변경 가능  yy/mm/dd  yy.mm.dd 
	    prevText: '이전 달',
	    nextText: '다음 달',
	    monthNames: ['1월','2월','3월','4월','5월','6월','7월','8월','9월','10월','11월','12월'],
	    monthNamesShort: ['1월','2월','3월','4월','5월','6월','7월','8월','9월','10월','11월','12월'],
	    dayNames: ['일','월','화','수','목','금','토'],
	    dayNamesShort: ['일','월','화','수','목','금','토'],
	    dayNamesMin: ['일','월','화','수','목','금','토'],
	    showMonthAfterYear: true,
	    yearSuffix: '년'
	  });
	});
</script>
<style>    // css는 datepicker   크기 조절입니다.
	.ui-datepicker{ font-size: 12px; width: 160px; }
	.ui-datepicker select.ui-datepicker-month{ width:30%; font-size: 11px; }
	.ui-datepicker select.ui-datepicker-year{ width:40%; font-size: 11px; }
</style>
</head>
	
	<p>Date: <input type="text" id="datepicker"></p>

</html

참조 https://jqueryui.com/datepicker/

이렇게 사용 하시면 영어 작동하게 됩니다.

저작자표시